Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]


Groups > comp.lang.javascript > #13686

Re: Two-line Buttons

Newsgroups comp.lang.javascript
Subject Re: Two-line Buttons
From "Evertjan." <exjxw.hannivoort@interxnl.net>
References <jni0mq$b9a$1@dont-email.me>
Message-ID <XnsA0445E2DB188Aeejj99@194.109.133.133> (permalink)
Date 2012-04-29 07:15 +0000

Show all headers | View raw


Art Shapiro wrote on 29 apr 2012 in comp.lang.javascript:

> <form>
>    <INPUT TYPE=button value="Irvine&#13;&#10;Weather"
>     style="background-color:darkblue; color:white;
>       border-style:doubledotted;
>       border-color:Navy; border-width:3px;
>           font-style:normal;
>       font-variant:normal;
>       font-weight:bold;
>       font-size:14px;
>       font-family:Arial;
>       width:160px;
>       text-align:center"
> 
> onmouseover="this.style.backgroundColor='gold';
>      this.style.color='red';
>      this.style.fontSize='16px' "
> 
> onmouseout="this.style.backgroundColor='darkblue';
>          this.style.color='white';
>          this.style.fontSize='14px' "
> 
> onClick="window.location.href='http://forecast.weather.gov/MapClick.php
> ?lat=33.67592566096207&lon=-117.78336811170448&site=sgx&smap=1&unit=0&l
> g=en&FcstType=text';return false" >
> 
> </form>

Try a <button> element:

=======================================
<style type='text/css'>
button.myButton {
 background-color:darkblue; 
 color:white;
 border-color:navy; 
 border-width:3px;
 font-style:normal;
 font-variant:normal;
 font-weight:bold;
 font-size:14px;
 font-family:Arial;
 width:160px;
 height:50px;
 text-align:center;
}
button.myHover {
 background-color:gold;
 color:red;
 font-size:16px;
}
</style>

<button
 class='myButton'
 onclick="window.location.href='http://cnn.com';" 
 onmouseover='this.className="myButton myHover"'
 onmouseout ='this.className="myButton"'
>
Irvine
<br>
Weather
</button>
=======================================

The whole onmouse... & myHover exercise is only necessary for IE,
as with more normal major browsers, this would be fine:

button:hover {
 background-color:gold;
 color:red;
}


-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread


Thread

Two-line Buttons Art Shapiro <arthur-temp-3@cox.net> - 2012-04-28 17:06 -0700
  Re: Two-line Buttons "Richard Cornford" <Richard@litotes.demon.co.uk> - 2012-04-29 03:17 +0100
    Re: Two-line Buttons Swifty <steve.j.swift@gmail.com> - 2012-04-29 08:06 +0100
  Re: Two-line Buttons "Evertjan." <exjxw.hannivoort@interxnl.net> - 2012-04-29 07:15 +0000
  Re: Two-line Buttons Art Shapiro <arthur-temp-3@cox.net> - 2012-04-29 07:04 -0700

csiph-web