rollover image in a div does not work

Hi

I have menu list that are in div tags. I want an image to appear when
I move over the menu item or click on it. I am trying it with the html
code and css style below. It does not work, the image is not
appearing. What must I change in my html or css code?

Re: rollover image in a div does not work

Harry Bellafonte wrote:
> Hi
>
> I have menu list that are in div tags. I want an image to appear when
> I move over the menu item
^^^^^^^^^^^^^^^^^^^^^^^^^

> div#menutitle a:active{background-image: url(/wps/wcm/connect/
^^^^^^^^

The pseudo-class is :hover for a "mouseover"

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

Re: rollover image in a div does not work

On 13 okt, 21:28, "Jonathan N. Little" wrote:
> Harry Bellafonte wrote:
> > Hi
>
> > I have menu list that are in div tags. I want an image to appear when
> > I move over the menu item
>
> ^^^^^^^^^^^^^^^^^^^^^^^^^
>
> > div#menutitle a:active{background-image: url(/wps/wcm/connect/
>
> ^^^^^^^^
>
> The pseudo-class is :hover for a "mouseover"
>
> --
> Take care,
>
> Jonathan
> -------------------
> LITTLE WORKS STUDIOhttp://www.LittleWorksStudio.com

Hi

I have changed the css to

div#menutitle a:hover{background-image: url(/wps/wcm/connect/
button_rollover_state.jpg?);}

but it still does not work.

Re: rollover image in a div does not work

On 2007-10-13, Harry Bellafonte wrote:
> On 13 okt, 21:28, "Jonathan N. Little" wrote:
[...]
> div#menutitle a:hover{background-image: url(/wps/wcm/connect/
> button_rollover_state.jpg?);}
>
> but it still does not work.

Menutitle is a class not an id, so you need div.menutitle, not
div#menutitle. And you do want :hover.

Re: rollover image in a div does not work

Harry Bellafonte wrote:
> Hi
>
> I have menu list that are in div tags.

If it's alist, where are the

and
• elements?
  
  > I want an image to appear when
  > I move over the menu item or click on it. I am trying it with the html
  > code and css style below. It does not work, the image is not
  > appearing. What must I change in my html or css code?
  >
  >
  
  >
  >
  
  
  Maybe you'd prefer
  .
  
  [snippage]
  
  >

  Equipment
  >

  
  >
  > div#menutitle a:active{background-image: url(/wps/wcm/connect/
  > button_rollover_state.jpg?);}
  
  div#menutitle refers to div(s) with an id of menutitle, but you don't
  have any of those. For the markup you typed or pasted here, a better
  rule would look like:
  
  div.menutitle a:hover {
  background-image: url(/wps/wcm/connect/button_rollover_state.jpg);}
  
  Note that my CSS lacks question marks. I would get rid of extra spaces
  in my markup's class names, too. Have you validated your actual code
  (HTML and CSS)?
  
  HTH.
  
  --
  John
  Trying so hard to ignore posts from GoogleGroups.
  UIP: http://improve-usenet.org/

Re: rollover image in a div does not work

On 13 okt, 22:15, John Hosking
wrote:
> Harry Bellafonte wrote:
> > Hi
>
> > I have menu list that are in div tags.
>
> If it's alist, where are the

and
• elements?
  >
  > > I want an image to appear when
  > > I move over the menu item or click on it. I am trying it with the html
  > > code and css style below. It does not work, the image is not
  > > appearing. What must I change in my html or css code?
  >
  > >
  
  > >
  > >
  
  >
  > Maybe you'd prefer
  .
  >
  > [snippage]
  >
  > >

  Equipment
  > >

  
  >
  > > div#menutitle a:active{background-image: url(/wps/wcm/connect/
  > > button_rollover_state.jpg?);}
  >
  > div#menutitle refers to div(s) with an id of menutitle, but you don't
  > have any of those. For the markup you typed or pasted here, a better
  > rule would look like:
  >
  > div.menutitle a:hover {
  > background-image: url(/wps/wcm/connect/button_rollover_state.jpg);}
  >
  > Note that my CSS lacks question marks. I would get rid of extra spaces
  > in my markup's class names, too. Have you validated your actual code
  > (HTML and CSS)?
  >
  > HTH.
  >
  > --
  > John
  > Trying so hard to ignore posts from GoogleGroups.
  > UIP:http://improve-usenet.org/
  
  ok, here is the rest of the code that deals with the menu list:
  
  
  

  
  

  Products

  
  

  Real-estate
  

  
  

  
  
  

  
  

  Decoration

  
  

  Toys

  
  

  Sport

  
  

  Equipment
  

  
  
  And here are all css that has to do with the id and class of the div
  tags:
  div.menutitle a:hover{background-image: url(/wps/wcm/connect/
  button_rollover_state.jpg);}
  ..ver_nav #masterdiv ul, .ver_nav #masterdiv ul li ul{
  list-style-type: none;
  margin: 0px;
  padding: 0px;
  }
  
  ..ver_nav #masterdiv ul li a, .ver_nav #masterdiv ul li ul li a{
  display: block;
  width: 161px;
  min-height: 24px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  font-weight: bold;
  color: #ffffff;
  text-decoration: none;
  line-height: 22px;
  margin: 0 0 1px 0;
  padding: 0 0 0 0;
  background-repeat: no-repeat;
  background-color: #5E73C2;
  }
  
  ..ver_nav #masterdiv ul li ul li a{
  font-weight: normal;
  color: #000000;
  margin: 0;
  padding: 0 0 0 7px;
  line-height: 22px;
  background-repeat: no-repeat;
  background-color: #FFF;
  }
  
  * html .ver_nav #masterdiv ul li a,
  * html .ver_nav #masterdiv ul li ul li a{
  height: 24px;
  }
  ..ver_nav,.ver_nav_wide {
  width: 178px;
  height: 350px;
  padding-left: 9px;
  padding-right: 0px;
  background-color: #FFFFFF;
  vertical-align: top;
  }
  
  ..ver_nav_narrow{
  width: 78px;
  }
  #masterdiv .active{
  background-color: #000;
  }

Re: rollover image in a div does not work

Harry Bellafonte wrote:
> On 13 okt, 22:15, John Hosking wrote:

[my entire previous post, quoted in full (but who really expected
anything different?), snipped, except for my sig, which the OP quoted
but ignored]

>>
>> HTH.
>>
>> --
>> John
>> Trying so hard to ignore posts from GoogleGroups.
>> UIP: http://improve-usenet.org/

Burned again. I'm *such* a slow learner.

>
> ok, here is the rest of the code that deals with the menu list:

[some partial markup that nobody asked for and even fewer people want to
see, snipped]

> And here are all css that has to do with the id and class of the div
> tags:

[Similarly unexpected and undesired CSS likewise snipped.]

Why did you post this? (<== a mostly rhetorical question)

For future posts:


--
John
Seeing that Blinky's right *sigh*
UIP: http://improve-usenet.org/

Re: rollover image in a div does not work

John Hosking wrote:
> Harry Bellafonte wrote:
>> On 13 okt, 22:15, John Hosking wrote:
>
> [my entire previous post, quoted in full (but who really expected
> anything different?), snipped, except for my sig, which the OP quoted
> but ignored]
>
>>>
>>> HTH.
>>>
>>> --
>>> John
>>> Trying so hard to ignore posts from GoogleGroups.
>>> UIP: http://improve-usenet.org/
>
> Burned again. I'm *such* a slow learner.

:)


--
Blinky RLU 297263
Killing all posts from Google Groups
The Usenet Improvement Project - http://improve-usenet.org

Re: rollover image in a div does not work

In article <47113e61$1_4@news.bluewin.ch>,
John Hosking wrote:

> Harry Bellafonte wrote:
> > On 13 okt, 22:15, John Hosking wrote:

> For future posts:
>

Harry, Ben C and JH added further to JL's advice salient to your
query, the time has now come for a URL if things are not working
and you have followed advice. Failure to do so - Harry - might
cause the following frightening thing (towards the end of the
clip) to happen to you next time you are sitting at a dining
table:



--
dorayme

Re: rollover image in a div does not work

Well bust mah britches and call me cheeky, on Sat, 13 Oct 2007 21:54:41 GMT
John Hosking scribed:

> Harry Bellafonte wrote:
>> On 13 okt, 22:15, John Hosking wrote:
>>

> Burned again. I'm *such* a slow learner.

Best chuckle I've had since dorayme tried to explain English grammar.

--
Neredbojias
Half lies are worth twice as much as whole lies.

Re: rollover image in a div does not work

On 14 okt, 01:50, dorayme wrote:
> In article <47113e61$...@news.bluewin.ch>,
> John Hosking wrote:
>
> > Harry Bellafonte wrote:
> > > On 13 okt, 22:15, John Hosking wrote:
> > For future posts:
>
> Harry, Ben C and JH added further to JL's advice salient to your
> query, the time has now come for a URL if things are not working
> and you have followed advice. Failure to do so - Harry - might
> cause the following frightening thing (towards the end of the
> clip) to happen to you next time you are sitting at a dining
> table:
>
>
>
> --
> dorayme

Hi

Excuse me for not following the rules of this forum. My english is not
that perfect. I did what was told me to do but it did not worked. The
reason I posted more html and css code was in order to let you know
what I have done wrong. But probably that was a bad move looking at
all the reactions that followed my last post.

Regards

Re: rollover image in a div does not work

Harry Bellafonte wrote:

> Hi
>
> Excuse me for not following the rules of this forum. My english is not
> that perfect. I did what was told me to do but it did not worked. The
> reason I posted more html and css code was in order to let you know
> what I have done wrong. But probably that was a bad move looking at
> all the reactions that followed my last post.

Harry a tip, since you are have problems most likely your do not know
where the problem is located else your would have corrected it. There is
a good chance the problem is *not* located in the fragment that you
supply. Now *don't* post the code of the whole page, but a URL|link|web
address *to* the page on your site that show the problem. If it is only
on your hard drive then upload it to a temporary place on your website.
Then and only then will we have a chance of seen where the problem lies...

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

Re: rollover image in a div does not work

On 14 okt, 15:03, "Jonathan N. Little" wrote:
> Harry Bellafonte wrote:
> > Hi
>
> > Excuse me for not following the rules of this forum. My english is not
> > that perfect. I did what was told me to do but it did not worked. The
> > reason I posted more html and css code was in order to let you know
> > what I have done wrong. But probably that was a bad move looking at
> > all the reactions that followed my last post.
>
> Harry a tip, since you are have problems most likely your do not know
> where the problem is located else your would have corrected it. There is
> a good chance the problem is *not* located in the fragment that you
> supply. Now *don't* post the code of the whole page, but a URL|link|web
> address *to* the page on your site that show the problem. If it is only
> on your hard drive then upload it to a temporary place on your website.
> Then and only then will we have a chance of seen where the problem lies...
>
> --
> Take care,
>
> Jonathan
> -------------------
> LITTLE WORKS STUDIOhttp://www.LittleWorksStudio.com

Hi

The problem is that I don't have a temporary website where I can
upload the URL address to. Is there another way I can let you see
where the problem lies?

Regards

Re: rollover image in a div does not work

Harry Bellafonte wrote:

> The problem is that I don't have a temporary website where I can
> upload the URL address to. Is there another way I can let you see
> where the problem lies?

http://www.google.com/search?hl=en&q=free+web+hosting&btnG=G oogle+Search
free web hosting - Google Search

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com