Thanks so much for your great response and all the links. I have tried the solution but so far it doesn't seem to work. I will be reviewing everything on my end to make sure I didn't cause the problem myself. I will comment again with more info if I cant get it to work.
Thanks again!! On May 6, 12:07 am, "T.J. Crowder" <[email protected]> wrote: > Hi, > > If I'm understanding you, you want to hide the "inner2" divs, but then > show them if the "outer-div" divs are hovered. The `mouseenter` and > `mouseleave` events can help you with that: > > $$('div.outer-div').each(function(div) { > div.observe('mouseenter', function() { > this.down('div.inner2').show(); > }); > div.observe('mouseleave', function() { > this.down('div.inner2').hide(); > }); > }); > > You don't have to worry about two "inner2" divs showing at the same > time unless the "outer-div" divs are overlapping, which I suspect they > aren't, since `mouseleave` will fire to hide the previous one. > > What I used there: > > $$ to find the outer-divs[1] > Enumerable#each to loop through them[2] > Event#observe (indirectly through Element#observe) to hook up event > handlers[3] > Element#down to find the "inner2" div within the outer div[4] > Element#show[5] and Element#hide[6] > > [1]http://api.prototypejs.org/language/dollardollar/(that link will > only work for a little while, it *should* > behttp://api.prototypejs.org/dom/dollardollar/ > but right now it's wrong) > [2]http://api.prototypejs.org/language/enumerable/prototype/each/ > [3]http://api.prototypejs.org/dom/event/observe/ > [4]http://api.prototypejs.org/dom/element/down/ > [5]http://api.prototypejs.org/dom/element/show/ > [6]http://api.prototypejs.org/dom/element/hide/ > > If you haven't already, it's very, very much worth your time to read > through the entire API front-to-back. It only takes about an hour. > > HTH, > -- > T.J. Crowder > Independent Software Consultant > tj / crowder software / comwww.crowdersoftware.com > > On May 6, 2:05 am, Pixelflips <[email protected]> wrote: > > > > > I have a few sets of divs that contain three divs set up in the > > following way: > > > <div class="outer-div"> > > <div class="inner1"></div> > > <div class="inner2" style="display:none;"></div> > > </div> > > > <div class="outer-div"> > > <div class="inner1"></div> > > <div class="inner2" style="display:none;"></div> > > </div> > > > <div class="outer-div"> > > <div class="inner1"></div> > > <div class="inner2" style="display:none;"></div> > > </div> > > > I have the second inner div of each hidden via the inline style. What > > I am trying to accomplish is that when the outer div of any, or > > basically any of the content is hovered over then the inner2 would > > appear but only one at a time within the outer-div. > > > I am unfamilar with Prototype and having a terrible time trying to get > > my head around it. > > > Thanks in advance for any help!! > > > -- > > You received this message because you are subscribed to the Google Groups > > "Prototype & script.aculo.us" group. > > To post to this group, send email to > > [email protected]. > > To unsubscribe from this group, send email to > > [email protected]. > > For more options, visit this group > > athttp://groups.google.com/group/prototype-scriptaculous?hl=en. > > -- > You received this message because you are subscribed to the Google Groups > "Prototype & script.aculo.us" group. > To post to this group, send email to [email protected]. > To unsubscribe from this group, send email to > [email protected]. > For more options, visit this group > athttp://groups.google.com/group/prototype-scriptaculous?hl=en. -- You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
