[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1182
  • Last Modified:

rollover form and click changing background color question

 say you have the following

<input name="formbox1" type="text" class="test" style="background-color:#b6c9ea" tabindex="2" onFocus="this.style.backgroundColor='#d4eefd';" onBlur="this.style.backgroundColor='#b6c9ea';" onMouseOver="this.style.backgroundColor='#d4eefd';" onMouseOut="this.style.backgroundColor='#b6c9ea';" size="20">

First how do i change the colors to background image loads so i can use the colors i want, secondly, if i want the user to be able to mouseover and have the color change, but click and have the mouseover color stay with that form ( without following the mouseover behavoiur again once i move the mouse off?) any suggestions would be great.

is there a way to do the mouseover and click attributes at the same time but obey the onclick once the mouse moves off?- this might be a ridiculous question, i just thought it would be cool to be able to see visually a little better which forms you haven't or have filled out depending on the color of them more than what text is in them-please feel free to give me your opinions on this.
0
toddkeller
Asked:
toddkeller
  • 4
  • 3
1 Solution
 
alinaxCommented:
.imagebg {
      background-attachment: fixed;
      background-image: url(imagedir/imagename.gif);
      background-repeat: repeat;
}

the image  can be any .gif, .png, ....

This was made in css and the styesheet was called imagebg.css.

You apply it to the form and then use the colours as you want.

This is an idea to change on mouse over and click

.......
onMouseOver =" rollOver('#color',true)"
onMouseOut =" rollOver('#color',false)"
onMouseDown =" rollPress('#color',true)"
onMouseUp =" rollPress('#color',false)"
onClick =" rollClick('#color')">

You can use the same or different color anywhere. Give it a try.
Alina
0
 
toddkellerAuthor Commented:
thanks i will try it out and get back to you!-
0
 
toddkellerAuthor Commented:
i must be doing something wrong, i put this in the form tag, didn't know if i was supposed to get rid of the background style or not-i did and it changed to the onMouseDown color, but i get no action when i rollover it.? am i using the roll commands correctly?

<input name="form1" type="text" class="test" id="form1" style="background-color:#b6c9ea" tabindex="1" onMouseOver=" rollOver('#d4eefd',true)" onMouseOut=" rollOver('#b6c9ea',false)" onMouseDown=" rollPress('#d4eefd',true)" onMouseUp=" rollPress('#b6c9ea',false)" onClick="rollClick('#d4eefd')" size="30">
0
Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
toddkellerAuthor Commented:
The first was what i was looking for thanks,
t
0
 
alinaxCommented:
Can I see the site now?
Post url
Nice to help
Alina
0
 
toddkellerAuthor Commented:
heh, i wish!, it's got alot more to go, soon though, it is actually 2 sites working together with a software package in house, but i'll let you know when it's up, :)
t
0
 
alinaxCommented:
I´m sure you forgot puttting the list of images that must be loaded for mouse over
Dreamweaver does it directly when inserting them.
Alina
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 4
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now