P
Paul
May I obtain the above effect using Frontpage or writing codes in html?
Have you some code or some link for me to test? Thanks
Paul
Have you some code or some link for me to test? Thanks
Paul
May I obtain the above effect using Frontpage or writing codes in html?
Have you some code or some link for me to test? Thanks
Paul
Brynn said:Here is a nice lesson with CSS, Javascript, and Html. Just copy
everything below into a file and play.
<html><body>
<!--
The CSS
We will make 2 different "classes" ... one with the first style ..
then one with the mouse over style.
-->
<style type="text/css">
.theStyle1, .theStyle2 {font: bold 10pt verdana; padding: 4px;}
.theStyle1 {background-color: #E3EEE2; color: black;}
.theStyle2 {background-color: #0E4E07; color: white;}
</style>
<!-- Now the button -->
<input type="button" class="theStyle1" value="Test Button"
onMouseOver="this.className='theStyle2';"
OnMouseOut="this.className='theStyle1';">
Brynn said:Here is a nice lesson with CSS, Javascript, and Html. Just copy
everything below into a file and play.
<html><body>
<!--
The CSS
We will make 2 different "classes" ... one with the first style ..
then one with the mouse over style.
-->
^^^ ^^^^^^^^<style type="text/css">
.theStyle1, .theStyle2 {font: bold 10pt verdana; padding: 4px;}
.theStyle1 {background-color: #E3EEE2; color: black;}
.theStyle2 {background-color: #0E4E07; color: white;}
</style>
<!-- Now the button -->
<input type="button" class="theStyle1" value="Test Button"
onMouseOver="this.className='theStyle2';"
OnMouseOut="this.className='theStyle1';">
</body></html>
Jonathan said:This is not a particularly good example in many ways. Firstly it
requires JavaScript. This done be done is CSS for modern browsers and a
Bit of special MS JScript in MS's special HTC file for IE's lack of CSS
support.
And now the English translation:
This is not a particularly good example in many ways. Firstly, it
requires JavaScript. This can done will CSS for modern browsers, and
with a bit of special MS JScript in MS's special HTC file to compensate
for IE's lack of CSS support.
Jonathan said:And now the English translation:
This is not a particularly good example in many ways. Firstly, it
requires JavaScript. This can done will CSS for modern browsers, and
with a bit of special MS JScript in MS's special HTC file to compensate
for IE's lack of CSS support.
Blinky said:Jonathan N. Little wrote:
ARGH! *with*
I think line two's still in need of a little love.
Please don't recommend using points (points are for printing), nor
Verdana. See this:http://k75s.home.att.net/fontsize.html
Why mess with that when you can do it with CSS. Here's a sample of
buttons I wrote years ago.http://k75s.home.att.net/hover3d.html
What are you testing your code in there bud ... your buttons only work
in IE6 if you mouse over the text ... they work in firefox ok though.
In IE6 if you highlight the button part without the text, your buttons
do nothing.
Jonathan said:I think I'll crawl back under my rock now...
May I obtain the above effect using Frontpage or writing codes in html?
Have you some code or some link for me to test? Thanks
Paul
^^^ ^^^^^^^^Brynn said:My last post ... because this post about a button was so important to
Jonathan and Blinky ... I streamlined my button code and changed my
CSS class names for them. Like I said, maybe some day their button
code will work in IE6 ... until then, I would suggest using my
code ... it is less code to mess with for one ... and easier to breeze
through and get back to your business.
<html><body>
<!--
The CSS: We will make 2 different "classes" ... one with the first
style ..
then one with the mouse over style.
-->
<style type="text/css">
/* Inspired CSS */
.Blinky, .Jonathan {font: bold 10pt verdana; padding: 4px;}
.Blinky {background-color: #E3EEE2; color: black;}
.Jonathan {background-color: #0E4E07; color: white;}
</style>
<script language="javascript">
function changeButton(theChange) {
if (theChange == 0) {
document.getElementById('brynnButton').className='Blinky';
}
else {
document.getElementById('brynnButton').className='Jonathan';
}
}
</script>
<!-- Now the button -->
<input type="text" value="A field to tab from.">
<input id="brynnButton" type="button" class="Blinky" value="Test
Button"
onMouseOver="changeButton(1);" onFocus="changeButton(1);" ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
OnMouseOut="changeButton(0);" onBlur="changeButton(0);"> ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
</body></html>
Brynn said:My last post ...
Want to reply to this thread or ask your own question?
You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.