Phiên bản đầy đủ: jsB@nk » CSS » Các khu vực qua nút nhấn
URL: https://www.javascriptbank.com/text-sections.html
Hiệu ứng tạo ra các khu vực văn bản khác nhau trên trang web và mổi thời điểm chỉ hiển thị một khu vực, để di chuyển qua các khu vực khác, người dùng nhấn vào nút được chỉ định.
Phiên bản đầy đủ: jsB@nk » CSS » Các khu vực qua nút nhấn
URL: https://www.javascriptbank.com/text-sections.html
<style type="text/css"><!-- Paste this code into the CSS section of your HTML document -->input.button { color: #fff; background: #0034D0; font-size: x-small; font-weight:bold; font-family: Verdana, Arial, Helvetica, sans-serif; border: solid 1px #000;}</style><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<script language="javascript">// Created by: James Kennedy :: http://foxweb.marist.edu/users/kbpc3/example.htmlfunction toggleMe(a){ var next=document.getElementById(a); var b=new String(); b= a-1; var prev=document.getElementById(b); if(!next)return true; if(next.style.display=="none"){ next.style.display="block" prev.style.display="none" window.scrollTo(0,0); } else { next.style.display="none" } return true;}</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<div id="1" style="display: block; text-align: left;"><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p><input type="button" class="pagebutton button" onclick="return toggleMe('2')" value="Go to Section 2"></div><div id="2" style="display: none; text-align: left;"><p>Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. Souvlaki ignitus carborundum e pluribus unum. Defacto lingo est igpay atinlay. Marquee selectus non provisio incongruous feline nolo contendre. Gratuitous octopus niacin, sodium glutimate. Quote meon an estimate et non interruptus stadium. Sic tempus fugit esperanto hiccup estrogen. Glorious baklava ex librus hup hey ad infinitum. Non sequitur condominium facile et geranium incognito. Epsum factorial non deposit quid pro quo hic escorol. Marquee selectus non provisio incongruous feline nolo contendre Olypian quarrels et gorilla congolium sic ad nauseum. Souvlaki ignitus carborundum e pluribus unum.</p><input type="button" class="pagebutton button" onclick="return toggleMe('3')" value="Go to Section 3"></div><div id="3" style="display: none; text-align: left;"><p>Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc., li tot Europa usa li sam vocabularium. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe al desirabilit? de un nov lingua franca: on refusa continuar payar custosi traductores. It solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles. Ma quande lingues coalesce, li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues. It va esser tam simplic quam Occidental: in fact, it va esser Occidental. A un Angleso it va semblar un simplificat Angles, quam un skeptic Cambridge amico dit me que Occidental es.</p><input type="button" class="pagebutton button" onclick="return toggleMe('4')" value="Go to Section 4"></div><div id="4" style="display: none; text-align: left;"><p>Ma quande lingues coalesce, li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues. It va esser tam simplic quam Occidental: in fact, it va esser Occidental. A un Angleso it va semblar un simplificat Angles, quam un skeptic Cambridge amico dit me que Occidental es.</p><p><strong>Do not put a button on the last section; your page is done, the user can't go any farther.</strong><p><p><em>You could always add a button to reload the page:</em></p><input type="button" class="pagebutton button" onclick="window.location.reload()" value="Reload page"></div><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->