2013-10-25 2 views
0

Я пытаюсь создать ссылку, используя Див идентификатор вроде как: index.html#section3, index.html#section4, но он не работает:вертикальная табуляция с JQuery создать ссылку

<html> 
<head> 
<title>jQuery Vertical Tabs</title> 
<style type="text/css"> 
ul#verticalNav { 
    float:left; 
    clear:left; 
    width:15%; 
} 
div#sections { 
    float:right; 
    clear:right; 
    width:80%; 
} 
</style> 
<script type="text/javascript" 

src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
<script type="text/javascript"> 
function showSection(sectionID) { 
    $('div.section').css('display', 'none'); 
    $('div'+sectionID).css('display', 'block'); 
} 
$(document).ready(function(){ 
    if (
     $('ul#verticalNav li a').length && 
     $('div.section').length 
    ) { 
     $('div.section').css('display', 'none'); 
     $('ul#verticalNav li a').each(function() { 
      $(this).click(function() { 
       showSection($(this).attr('href')); 
      }); 
     }); 
     $('ul#verticalNav li:first-child a').click(); 
    } 
}); 
</script> 
</head> 
<body> 
    <h1>Vertical Navigation Example</h1> 
    <p>This page demonstrates a simple tabbed jQuery 

navigation scheme.</p> 
    <ul id="verticalNav"> 
     <li><a href="#section1">Section I</a></li> 
     <li><a href="#section2">Section II</a></li> 
     <li><a href="#section3">Section III</a></li> 
    </ul> 
    <div id="sections"> 
     <div class="section" id="section1"> 
      <h2>Section I</h2> 
      <p>Some content specific to this section...</p> 
     </div> 
     <div class="section" id="section2"> 
      <h2>Section II</h2> 
      <img src="#" alt="BADGER" /> 
     </div> 
     <div class="section" id="section3"> 
      <h2>Section III</h2> 
      <img src="#g" alt="SNAKE" /> 
     </div> 
    </div> 
</body> 
</html> 
+0

Почему вы не используете вкладки jquery '' –

+0

привет все еще не работает. – user2913707

ответ

0

посмотреть на JQuery вкладки http://jqueryui.com/tabs/ для хорошего современное решение. Доступно множество демонстраций.

+0

hi nw Я меняю существующий веб-сайт, поэтому я не могу перекодировать ... – user2913707

+0

Версия JQuery, которую вы используете, серьезно устарела –

+0

привет, как я могу перейти на функцию загрузки страницы: $ ('ul # verticalNav li: first-child a '). click(); – user2913707

Смежные вопросы