»
EnglishFrenchVietnamese

Print - Contractible Headers Script - JavaScriptBank.com

Full version: jsB@nk » Link » Contractible Headers Script
URL: https://www.javascriptbank.com/contractible-headers-script.html

Contractible Headers Script © JavaScriptBank.comA script that makes selected headers in a page contractible. Contents such as text, graphics, tables etc can be hidden inside the header that will be revealed only when the header is clicked on. All other browsers, including NS 4.x, will simply see the headers uncontracted (degrades well).

Full version: jsB@nk » Link » Contractible Headers Script
URL: https://www.javascriptbank.com/contractible-headers-script.html



CSS
<STYLE>A {COLOR: red; TEXT-DECORATION: none}A:hover {COLOR: white; TEXT-DECORATION: none}.textbox {BACKGROUND-COLOR: blue; BORDER-BOTTOM: 4px solid; BORDER-LEFT: 4px solid; BORDER-RIGHT: 4px solid; BORDER-TOP: 4px solid; COLOR: red; FONT-FAMILY: Verdana; FONT-SIZE: 18px; FONT-STYLE: normal; FONT-WEIGHT: bold; HEIGHT: 65px; PADDING-BOTTOM: 5px; PADDING-LEFT: 5px; PADDING-RIGHT: 5px; PADDING-TOP: 5px; TEXT-ALIGN: center; WIDTH: 250px}</STYLE><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<SCRIPT><!-- Beginning of JavaScript -// Edit your messages. You can add as many messages a you like.var message = new Array()message[0]="JavaScriptBank.com"message[1]="Bank of over 2000+ free JavaScript"message[2]="Provide thousands of free JavaScript"// The links of your messages. Be sure  that you configure as many links as messages.// If don't want to link your messages write '#' instead of an URL (see last sample).var messageurl = new Array()messageurl[0]="http://www.JavaScriptBank.com"messageurl[1]="http://www.JavaScriptBank.com"messageurl[2]="http://www.JavaScriptBank.com"// The width of your textbox (pixels). // Be sure that 'textwidth' is slightly bigger than the 'width' configured inside the stylesheetvar textwidth=260// The height of your textbox (pixels)// Be sure that 'textheight' is slightly bigger than the 'height' configured inside the stylesheetvar textheight=75// Final horizontal position of the textbox: distance to the left margin of the window (pixels)// IMPORTANT: // if you want to center the textbox in the middle of the browser-window then write -1.// If you want to place the textbox on an absolute position // then write the number (for instance 223).var x_finalpos=-1// Final vertical position of the textbox: distance to the top margin of the windowvar y_finalpos=20// Total number of textslicesvar textslices=10// Standstill of textbox (seconds)var pausetext=2// Speed of horizontal glidingvar step=40var pause=10// Do not edit the variables below this linevar x_rightspans=0var x_leftspans=0var marginrightvar marginleftvar height_slice=Math.floor(textheight/textslices)var cliptop=0var clipbottom=cliptop+height_slicevar clipleft=0var clipright=textwidthvar spannummer=0var spannrbefore=0var i_message=0pausetext=pausetext*1000function initiate() {    if (document.all) {    if (x_finalpos==-1) {    x_finalpos=Math.floor(document.body.clientWidth/2)-Math.floor(textwidth/2)    }changemessage()}}function changemessage() {for (i=0;i<=textslices-1;i++) {var thisspan=eval("span"+i)thisspan.innerHTML="<a href='"+messageurl[i_message]+"' target='blank'>"+message[i_message]+"</a>"}gostartposition()}function gostartposition() {for (i=0;i<=textslices-1;i+=2) {var thisspan=eval("document.all.span"+i+".style")thisspan.posLeft=marginright}for (i=1;i<=textslices-1;i+=2) {var thisspan=eval("document.all.span"+i+".style")thisspan.posLeft=marginleft}moveslices_IE()}function moveslices_IE() {if (x_rightspans==0 || x_leftspans==0) {if (x_rightspans==0) {for (i=0;i<=textslices-1;i+=2) {var thisspan=eval("document.all.span"+i+".style")thisspan.posLeft-=step}if (thisspan.posLeft<=x_finalpos) {x_rightspans=1for (i=0;i<=textslices-1;i+=2) {var thisspan=eval("document.all.span"+i+".style")thisspan.posLeft=x_finalpos}}}if (x_leftspans==0) {for (i=1;i<=textslices-1;i+=2) {var thisspan=eval("document.all.span"+i+".style")thisspan.posLeft+=step}if (thisspan.posLeft>=x_finalpos) {x_leftspans=1for (i=1;i<=textslices-1;i+=2) {var thisspan=eval("document.all.span"+i+".style")thisspan.posLeft=x_finalpos}}}var timer=setTimeout("moveslices_IE()",pause)}else {clearTimeout(timer)x_rightspans=0x_leftspans=0i_message++if (i_message > message.length-1) {i_message=0}var timer=setTimeout("changemessage()",pausetext)}}// - End of JavaScript - --></SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<body onload=initiate()><SCRIPT><!-- Beginning of JavaScript -// Do not edit this script-blockif (document.all) {for (i=0;i<=textslices-1;i+=2) {marginright=document.body.clientWidth+50    document.write("<span class='textbox' id='span"+i+"' style='position:absolute;visibility:visible; left:"+marginright+"px;top:"+y_finalpos+"px;clip:rect("+cliptop+"px "+clipright+"px "+clipbottom+"px "+clipleft+"px)'>")    document.write("</span>")cliptop+=2*height_sliceclipbottom+=2*height_slice}cliptop=height_sliceclipbottom=2*height_slicefor (i=1;i<=textslices-1;i+=2) {marginleft=-textwidth-50    document.write("<span class='textbox' id='span"+i+"' style='position:absolute;visibility:visible; left:"+marginleft+"px;top:"+y_finalpos+"px;clip:rect("+cliptop+"px "+clipright+"px "+clipbottom+"px "+clipleft+"px)'>")    document.write("</span>")cliptop+=2*height_sliceclipbottom+=2*height_slice}}// - End of JavaScript - --></SCRIPT></body><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->