Hi, Karl.. thanks for the reply.
Sigh... I guess it painfully obvious that I just haven't gotten
this "chaining" thing down. I can't quite figure out what
pertains to what. But even *I* should have caught the fact that
the "a" selectors weren't in any of the referenced div's... duh.
Now, I've got this:
$(document).ready(function() {
$('div.image-wrapper').find('div.menu-details').hide();
$('div.menu').find('a').mouseover(function() {
var answer = $('div.menu-details');
if (answer.is(':visible')) {
answer.slideUp();
} else {
answer.slideDown();
}
});
});
I added a new first line of the function to initially hide the 'menu-details'
div.
Works fine.
However, my mouseover function is a little dysfunctional, to put it mildly.
The first time I mouse over a menu item the div slides in... yay! However, the
next
menu item I mouseover causes the div to slideup. That makes sense according to
the
code above. How would I add a "mouseout" function to cause the div to slideup
when
I mouseout from the menu item?
Should be code have an added "mouseout" function or additional "if" clauses?
Thanks for the help!
> -----Original Message-----
> From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Karl
> Swedberg
> Sent: Sunday, January 13, 2008 10:21 AM
> To: jquery-en@googlegroups.com
> Subject: [jQuery] Re: Attempts failing to cause div to slide up, slide down
>
>
> Hey Rick,
>
> It looks like you're trying to bind the mouseover to links inside
> div.image-wrapper, but when I looked at your DOM, I didn't see any
> links there. That's probably why it's not working for you. ;-)
>
>
> --Karl
> _________________
> Karl Swedberg
> www.englishrules.com
> www.learningjquery.com
>
>
>
> On Jan 13, 2008, at 8:55 AM, Rick Faircloth wrote:
>
> >
> > Hi, all.
> >
> > I've made several attempts to figure out how to
> > cause a div to slide up and slide down when a menu item
> > is moused-over but so far, all attempts have failed.
> >
> > I can get the div to hide upon initialization of the page,
> > but the slide is non-responsive.
> >
> > My jQuery has been tried like this:
> >
> > $(document).ready(function() {
> >
> > $('div.image-wrapper').find('div.menu-
> > details').hide().end().find('a').mouseover(function() {
> > var answer = $('div.menu-details');
> > if (answer.is(':visible')) {
> > answer.slideUp();
> > } else {
> > answer.slideDown();
> > }
> > });
> > });
> >
> > and like this:
> >
> > $(document).ready(function() {
> >
> > $('div.image-wrapper').find('div.menu-
> > details').hide().end().find('a').mouseover(function() {
> > toggle('div.menu-details');
> > });
> > });
> >
> > but neither variation has worked.
> >
> > The menu is a routine <ul><li><a href="." construct.
> >
> > Anyone see any errors and perhaps have another way to go about this?
> > I'm trying at this point just to get a single, blank div to respond
> > to the jQuery,
> > however, eventually, the content in the div will be based upon the
> > menu item moused-over.
> >
> > The url to view my attempts is http://c21ar.wsm-dev.com.
> >
> > The goal is to make something with HTML and jQuery which emulates
> > the functionality for the to menu
> > at this site: http://www.AtlantaFalcons.com
> >
> > Thanks for any assistance and thoughts!
> >
> > Rick
> >
> >
