[jQuery] Re: controlling li-items with unique IDs and trigger corresponding DIVs

[Sean Ronan (Activepixels)]

Hi Jannik,

How would your example be adapted to use mouseovers and then hide the div
once the mouse is off either the li or the div.

I posted a question earlier today "show/hide flyout menu panel" and it seems
your approach gets me half way there.

The application is a flyout menu - using divs to hold scrollable list items.


Regards
Sean
sean ronan
activepixels
office :   01245 399 499
email :  [EMAIL PROTECTED]
web :    activepixels.co.uk
Activepixels is a limited company registered in England and Wales.
Registered number: 5081009.
Registered office: Suite SF8, The Heybridge Business Centre, 110 The
Causeway, Maldon, Essex, CM1 3TY.
-----Original Message-----
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Jannik
Sent: 12 February 2008 14:25
To: jQuery (English)
Subject: [jQuery] Re: controlling li-items with unique IDs and trigger
corresponding DIVs


Try this:
$(document).ready(function (){
        $('div.page').hide();
        $('#menu li').click(function (){
                $('div.page').hide();
                $('#div'+$(this).attr('id')).show();
        });
});

<ul id="menu">
    <li id="link1">Lorem ipsum dolor</li>
    <li id="link2">Lorem ipsum dolor</li>
    <li id="link3">Lorem ipsum dolor</li>
    <li id="link4">Lorem ipsum dolor</li>
</ul>
<div id="divlink1" class="page">Div 1</div>
<div id="divlink2" class="page">Div 2</div>
<div id="divlink3" class="page">Div 3</div>
<div id="divlink4" class="page">Div 4</div>


On Feb 12, 2:37 pm, schnuck <[EMAIL PROTECTED]> wrote:
> hi guys,
>
> hope someone can give me a hint for this. if i had an unordered list
> as shown below, where the li-items had unique IDs - is there any way
> that we check which li-items has been clicked so depending on that, we
> could show/animate a corresponding, unique DIV (each li-items would
> have its own corresponding DIV)? these DIVs would be preloaded and
> hidden via CSS somewhere on the page.
>
> <ul>
>         <li id="link1">Lorem ipsum dolor</li>
>         <li id="link2">Lorem ipsum dolor</li>
>         <li id="link2">Lorem ipsum dolor</li>
>         <li id="link3">Lorem ipsum dolor</li>
>         <li id="link4">Lorem ipsum dolor</li>
> </ul>
>
> or do the li-items need to go into HREFs to accomplish this?
>
> i know this might be very simply to solve, but i just can;t figure it
> out. any help very appreciated.
>
> many thanks.