»
Tiếng AnhTiếng PhápTiếng Việt

In - Liên kết nội dung liên quan - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Trình đơn » Định hướng » Liên kết nội dung liên quan
URL: http://www.javascriptbank.com/semantic-on-page-content-list.html

Liên kết nội dung liên quan © JavaScriptBank.comMột đoạn mã tương tự như Trình đơn xếp gập để hiển thị nội dung có liên quan chỉ qua một cú nhấn chuột, và chỉ một chủ đề được hiển thị ở mỗi thời điểm. Tuy nhiên, thiết kế ở đoạn mã này không tốt bằng.

Phiên bản đầy đủ: jsB@nk » Trình đơn » Định hướng » Liên kết nội dung liên quan
URL: http://www.javascriptbank.com/semantic-on-page-content-list.html



JavaScript
<script type="text/javascript"><!--// Created by: skatan :: http://snipplr.com/users/skatan/function setLink(i) {a[i].onclick = function () { div[i].style.display = "block"; for(var j = 0; j < div.length; j++) {  if (i != j) {   div[j].style.display = "none";  }  } return false;}}function initTabs() {var tabs = document.getElementById("tabbed_sub"); // put in id for tabbed list herevar links = tabs.getElementsByTagName("a");div = [];a = [];//Initialize tabsfor (var i = 0; i < links.length; i++) { div[i] = document.getElementById(links[i].href.substr(links[i].href.indexOf("#") + 1)); if (i != 0) {  div[i].style.display="none"; } else {   div[i].style.display="block"; } a[i] = links[i]; setLink(i)}}// Multiple onload function created by: Simon Willison// http://simonwillison.net/2004/May/26/addLoadEvent/function addLoadEvent(func) {  var oldonload = window.onload;  if (typeof window.onload != 'function') {    window.onload = func;  } else {    window.onload = function() {      if (oldonload) {        oldonload();      }      func();    }  }}addLoadEvent(function() {  initTabs();});//--></script>


HTML
<ul id="tabbed_sub"><li><a href="#one">Travel to London with Us</a></li><li><a href="#two">Itinerary</a></li><li><a href="#three">Prices</a></li></ul><div style="display: block;" id="one">London is the capital city ofEngland and the United Kingdom, a mix of history, architecture andculture has created an amazing and constantly evolving city.</div><div style="display: none;" id="two"><ul style="margin-top: 1pt;">  <li><strong>Day One:</strong>Visit Westminster Abbey, the Royal Tombs, and Poets' Corner. Afterward,stroll around the Houses of Parliament. Later in the afternoon, explorePiccadilly Circus, the teeming epicenter of London's West End. Havedinner in Soho.</li>  <li><strong>Day Two:</strong> Visit Green Park.Buckingham Palace and the changing of the Guard. Visit the Royal Mews,Trafalgar Square, the National Gallery. After dinner in the CoventGarden area or on the Thames, pick up your travel guide or ask afriendly-looking Londoner for a recommendation for a bar, pub, or club.</li>  <li><strong>Day Three:</strong>Visit The Tower of London. Explore the precincts on your own, makingcertain you allot enough time to see the Crown Jewels. From the Tower,head over to nearby St. Paul's Cathedral.</li></ul></div><div style="display: none;" id="three">$1,250 per person, including air and breakfast.</div></div>