Results 1 to 2 of 2

Thread: How to rollover

  1. #1
    Join Date
    Feb 2009
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default How to rollover

    1) Script Title:
    Tabcontent

    2) Script URL (on DD):
    http://www.dynamicdrive.com/dynamici...tabcontent.htm

    3) Describe problem:
    I want to use this script with rollover. How can i do it? Not by clicking, when rollover the tab it'll change..

    Please help me

  2. #2
    Join Date
    Feb 2008
    Posts
    137
    Thanks
    18
    Thanked 2 Times in 2 Posts

    Default

    Did you read the docs?

    This is the simplest, simplest way of doing it...
    PHP Code:
    <h3>Demo #1- Basic implementation</h3>
    <ul id="countrytabs" class="shadetabs">
    <
    li><a href="#" rel="country1" class="selected" onmouseover="javascript:countries.expandit(0)">Tab 1</a></li>
    <
    li><a href="#" rel="country2" onmouseover="javascript:countries.expandit(1)">Tab 2</a></li>
    <
    li><a href="#" rel="country3" onmouseover="javascript:countries.expandit(2)">Tab 3</a></li>
    <
    li><a href="#" rel="country4" onmouseover="javascript:countries.expandit(3)">Tab 4</a></li>
    <
    li><a href="http://www.dynamicdrive.com">Dynamic Drive</a></li>
    </
    ul>
    <
    div style="border:1px solid gray; width:450px; margin-bottom: 1em; padding: 10px">
    <
    div id="country1" class="tabcontent">
    Tab content 1 here<br />Tab content 1 here<br />
    </
    div>
    <
    div id="country2" class="tabcontent">
    Tab content 2 here<br />Tab content 2 here<br />
    </
    div>
    <
    div id="country3" class="tabcontent">
    Tab content 3 here<br />Tab content 3 here<br />
    </
    div>
    <
    div id="country4" class="tabcontent">
    Tab content 4 here<br />Tab content 4 here<br />
    </
    div>
    </
    div>

    <
    script type="text/javascript">
    var 
    countries=new ddtabcontent("countrytabs")
    countries.setpersist(true)
    countries.setselectedClassTarget("link"//"link" or "linkparent"
    countries.init()
    </script>
    <p><a href="javascript:countries.cycleit('prev')" style="margin-right: 25px; text-decoration:none">Back</a> <a href="javascript: countries.expandit(3)">Click here to select last tab</a> <a href="javascript:countries.cycleit('next')" style="margin-left: 25px; text-decoration:none">Forward</a></p> 
    Please search and read the entire article next time, you may find documentation ...
    Cheers
    ASCII stupid question, get a stupid ANSI!
    Beta is Latin for still doesn’t work.
    Mac users swear by their Mac, PC users swear at their PC.
    Keyboard not found...Press any key to continue.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •