469,327 Members | 1,315 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,327 developers. It's quick & easy.

ok experts.....explain how this works

http://www.phoenity.com/newtedge/image_gallery/

Referring to the images at the top of the page, how does he achieve a mouse
over with no onmouseover command?

The only way I can see it being done is through the CSS.
But I'm not clear on how it works exactly.

Jul 23 '05 #1
14 1109
Richard wrote:
http://www.phoenity.com/newtedge/image_gallery/

Referring to the images at the top of the page, how does he achieve a mouse
over with no onmouseover command?

The only way I can see it being done is through the CSS.
But I'm not clear on how it works exactly.


CSS, hover.
Mick
Jul 23 '05 #2
Richard wrote:
http://www.phoenity.com/newtedge/image_gallery/

Referring to the images at the top of the page, how does he achieve a
mouse over with no onmouseover command?

The only way I can see it being done is through the CSS.
But I'm not clear on how it works exactly.


Yes, it's CSS.
Some things that are set to display:none become display:block when hovered.
For a more complete tutorial, try:
http://www.meyerweb.com/eric/css/edge/popups/demo.html
Jul 23 '05 #3
"Richard" <An*******@127.001> wrote in message
news:cs*********@news2.newsguy.com...
http://www.phoenity.com/newtedge/image_gallery/

Referring to the images at the top of the page, how does he achieve a
mouse
over with no onmouseover command?

The only way I can see it being done is through the CSS.
But I'm not clear on how it works exactly.


It isn't JavaScript (so it's off-topic for this newsgroup), but it isn't
rocket science to figure out how it works either:

1) View the source on the page, note that style is in style.css. Type
<url: http://www.phoenity.com/newtedge/ima...lery/style.css /> into
your address bar, hit enter
2) Note that style.css does two @imports. Figure image_gallery.css is
the one you want.
3) Type <url:
http://www.phoenity.com/newtedge/ima...ge_gallery.css /> into
your address bar, hit enter.
4) Read.

ul#gallery>li ul ...
ul#gallery>li:hover ...
ul#gallery>li:hover ul ...

Those take care of the "popup".

ul#gallery ul:before ...
ul#gallery ul:after ...

Those take care of the stuff above and below the horizontal rules in the
"popups".

--
Grant Wagner <gw*****@agricoreunited.com>
comp.lang.javascript FAQ - http://jibbering.com/faq
Jul 23 '05 #4
Richard wrote:
http://www.phoenity.com/newtedge/image_gallery/

Referring to the images at the top of the page, how does he achieve a
mouse over with no onmouseover command?

The only way I can see it being done is through the CSS.
But I'm not clear on how it works exactly.


Okay, obviously I'm missing something here.....What exactly is it that the
linked page is supposed to be doing?.....I get a page with a load of
identical icons of Newts down the left, and text beside them to the
right.....There are no mouse-over effects, and no action takes place when I
hover over them.....
Jul 23 '05 #5
Fat Sam wrote:
Richard wrote:
http://www.phoenity.com/newtedge/image_gallery/

Referring to the images at the top of the page, how does he achieve a
mouse over with no onmouseover command?

The only way I can see it being done is through the CSS.
But I'm not clear on how it works exactly.


Okay, obviously I'm missing something here.....What exactly is it
that the linked page is supposed to be doing?.....I get a page with a
load of identical icons of Newts down the left, and text beside them
to the right.....There are no mouse-over effects, and no action takes
place when I hover over them.....


I've just opened it in Firefox, and I now see what it's supposed to do.....

Apparently it doesn't work in IE6......

That's clever......Design an application that doesn't work properly in the
most commonly used browser.....
Jul 23 '05 #6
Fat Sam wrote:
Apparently it doesn't work in IE6......

That's clever......Design an application that doesn't work properly in the
most commonly used browser.....


Many authors like to explore the possibilities of CSS, even if it won't
work in IE. It's geek fun.

Experiences like yours might motivate some people to show public support
for Firefox and try to lessen IE's stranglehold.
--
Michael Wilcox
Jul 23 '05 #7
Michael Wilcox wrote:
Fat Sam wrote:
Apparently it doesn't work in IE6......

That's clever......Design an application that doesn't work properly in
the
most commonly used browser.....

Many authors like to explore the possibilities of CSS, even if it won't
work in IE. It's geek fun.

Experiences like yours might motivate some people to show public support
for Firefox and try to lessen IE's stranglehold.


And pigs could fly out brucie's butt....

--
-=tn=-
Jul 23 '05 #8
Travis Newbury wrote:
And pigs could fly out brucie's butt....


Are you sure that cops' pants have flies?
Jul 23 '05 #9
On Tue, 18 Jan 2005 20:47:28 -0000 Fat Sam wrote:
Richard wrote:
http://www.phoenity.com/newtedge/image_gallery/ Referring to the images at the top of the page, how does he achieve a
mouse over with no onmouseover command? The only way I can see it being done is through the CSS.
But I'm not clear on how it works exactly.
Okay, obviously I'm missing something here.....What exactly is it that
the
linked page is supposed to be doing?.....I get a page with a load of
identical icons of Newts down the left, and text beside them to the
right.....There are no mouse-over effects, and no action takes place
when I
hover over them.....


That's one of the reasons why I dumped IE in favor of firefox.

Jul 23 '05 #10
On Tue, 18 Jan 2005 20:38:29 GMT Grant Wagner wrote:
"Richard" <An*******@127.001> wrote in message
news:cs*********@news2.newsguy.com...
http://www.phoenity.com/newtedge/image_gallery/ Referring to the images at the top of the page, how does he achieve a
mouse
over with no onmouseover command? The only way I can see it being done is through the CSS.
But I'm not clear on how it works exactly.
It isn't JavaScript (so it's off-topic for this newsgroup), but it
isn't
rocket science to figure out how it works either: 1) View the source on the page, note that style is in style.css. Type <url:: http://www.phoenity.com/newtedge/ima...lery/style.css /> into your address bar, hit enter
2) Note that style.css does two @imports. Figure image_gallery.css is
the one you want.
3) Type <url:
http://www.phoenity.com/newtedge/ima...ge_gallery.css />
into
your address bar, hit enter.
4) Read. ul#gallery>li ul ...
ul#gallery>li:hover ...
ul#gallery>li:hover ul ... Those take care of the "popup". ul#gallery ul:before ...
ul#gallery ul:after ... Those take care of the stuff above and below the horizontal rules in
the
"popups".


Thanks grant.
Whilst searching about, I came across another menu which has some of the
same stuff built into it but not the "popups", and more closely to my needs.
I figured it had to with the hover action since I saw no mouse routines.
I just couldn't see how he manipulated the <li> stuff into the hover
section.
Jul 23 '05 #11
While sitting in a puddle Travis Newbury scribbled in the mud:

And pigs could fly out brucie's butt....


With brucie that just might be a possibility

--
D?
http://wipkip.biz just to raise my PR
Jul 23 '05 #12
Duende wrote:
While sitting in a puddle Travis Newbury scribbled in the mud:

And pigs could fly out brucie's butt....


With brucie that just might be a possibility


Where is that Brucie? I could use a little high minded entertainment.
Jul 23 '05 #13
Travis Newbury wrote:
Michael Wilcox wrote:
Fat Sam wrote:
Apparently it doesn't work in IE6......

That's clever......Design an application that doesn't work properly
in the
most commonly used browser.....


Many authors like to explore the possibilities of CSS, even if it
won't work in IE. It's geek fun.

Experiences like yours might motivate some people to show public
support for Firefox and try to lessen IE's stranglehold.

And pigs could fly out brucie's butt....


Rather unsettling visual notwithstanding, we can always hope. It WOULD
be a beautiful day... :)

--

*** Remove the DELETE from my address to reply ***

================================================== ====
Kevin Scholl http://www.ksscholl.com/
ks*****@comcast.DELETE.net
------------------------------------------------------
Information Architecture, Web Design and Development
------------------------------------------------------
We are the music makers, and we are the dreamers of
the dreams...
================================================== ====
Jul 23 '05 #14
Travis Newbury wrote:
Michael Wilcox wrote:
Fat Sam wrote:
Apparently it doesn't work in IE6......

That's clever......Design an application that doesn't work properly
in the
most commonly used browser.....

Many authors like to explore the possibilities of CSS, even if it
won't work in IE. It's geek fun.

Experiences like yours might motivate some people to show public
support for Firefox and try to lessen IE's stranglehold.


And pigs could fly out brucie's butt....


I'm sure that's already happened.....
Jul 23 '05 #15

This discussion thread is closed

Replies have been disabled for this discussion.

By using this site, you agree to our Privacy Policy and Terms of Use.