Jump to content



Photo

Javascript Jumping between <li>s

javascript

  • Please log in to reply
1 reply to this topic

#1 generalt

generalt

    Neowinian

  • Joined: 09-May 07

Posted 25 October 2013 - 21:21

I ripped some html source code from an old website in archive.org. The page I ripped has some javascript on it; it uses the jQuery library v1.4.2 and possibly a custom script created by this guy: http://remysharp.com...w-event-plugin/

 

I don't know anything about javascript but I've included both files in the html document. Here is the html that uses javascript:

<div id="product-nav" class="column">

                    <h3>Product Bundle</h3>

                    <ul>

                        

                            <li class="active" rel="181"><a href="javascript:void(0)">Product 1</a></li>

                        

                            <li rel="88"><a href="javascript:void(0)">Product 2</a></li>

                        

                            <li rel="180"><a href="javascript:void(0)">Product 3</a></li>

                        

                            <li rel="85"><a href="javascript:void(0)">Product 4</a></li>

                        

                    </ul>

</div>

Those links are used in the left nav menu to switch between product displays:

<div id="products" class="column">

                <ul>

      

                        <li class="product" id="p181">

                            

                                <h3>Product 1</h3>



                        </li>       

                    

                        <li class="product" id="p88" style="display:none;">

                            

                                <h3>Product 2</h3>

                              

                        </li>

                    

                        <li class="product" id="p180" style="display:none;">

                            

                                <h3>Product 3</h3>

                               

                        </li>

                    

                        <li class="product" id="p85" style="display:none;">

                            

                                <h3>Product 4</h3>

                               

                        </li>

                    

                </ul>

When I click the 'Product 2' button in the nav menu, nothing happens. What do I need to do to get this javascript to work?

 

I can put the actual files online if it would help you understand what I'm trying to do. Just let me know.




#2 thomastmc

thomastmc

    Unofficial Attorney of Neowin

  • Joined: 18-July 12
  • Location: Kansas City
  • OS: Windows 8.1 Pro
  • Phone: Lumia 928

Posted 25 October 2013 - 21:33

You really need to post the javascript that is associated with the list <li> tags.





Click here to login or here to register to remove this ad, it's free!