2 in 1 ticker

2 in 1 ticker

Super! en zeer ruimtebesparend deze image+ text scroller!!

Plaats de code tussen de <BODY> tags van je pagina, vervang wel even de tekst en natuurlijk je eigen afbeeldingen.

</head> 
<body onload="initiate()">

<SCRIPT> 
<!-- Beginning of JavaScript - 
// Edit your messages. You can add as many messages a you like. 
var message = new Array() 
message[0]="Dit is een super ticker, je kunt er zoveel in kwijt als je maarzelf wilt." 
message[1]="Je kunt er iedere afbeelding inplaatsen met ieder formaat, je kunt ze ook doorlinken." 
message[2]="Alles is makkelijk aan te passen en het word door iedere browser ondersteund."

// The links of your messages. Be sure that you configure as many links as messages. 
// If you don't want to link a message write '#' instead of an URL (see last sample). 
var messageurl = new Array() 
messageurl[0]="http:\/\/www.noukie.nl" 
messageurl[1]="http:\/\/www.anouksdesign.nl" 
messageurl[2]="http:\/\/www.anouksweb.nl"

// The images for your messages. 
var messageimg = new Array() 
messageimg[0]="lopez.jpg" 
messageimg[1]="rickymartin.jpg" 
messageimg[2]="shakira.jpg"

// Alignment for each image in relation to its message-text (right or left) 
var alignimg=new Array() 
alignimg[0]="right" 
alignimg[1]="left" 
alignimg[2]="right"

// Alignment for message in relation to the margin of the messagebox 
var alignmessage=new Array() 
alignmessage[0]="left" 
alignmessage[1]="right" 
alignmessage[2]="right"

// target of the message-links (HTML conventions) 
var target_url="_blank"

// The width of your ticker 
var textwidth=240 
// The height of your ticker 
var textheight=100 
// The borderwidth of your ticker 
var borderwidth=0 
// The size of the font (HTML3 conventions) 
var font_size=1 
// font-face 
var font_face="verdana, arial, helvetica, sans-serif" 
// font-color 
var font_color="black" 
// background-color of the ticker 
var bg_ticker="ffffcc" 
// The horizontal position of the messagebox: distance to the left margin of the window 
var x_finalpos=10 
// The vertical position of the messagebox: distance to the top margin of the window 
var y_finalpos=10 
// Number of lamellas. 
var x_slices=12 
// Pause beween the messages (milliseconds) 
var pause=2000 
// Do not change the variables below this line 
var imgpreload=new Array() 
for (i=0;i<=messageimg.length-1;i++) { 
imgpreload[i]=new Image() 
imgpreload[i].src=messageimg[i] 
} 
var i_loop=0 
var i_message=0 
var width_slice=Math.ceil(textwidth/x_slices) 
var cliptop=0 
var clipbottom=textheight 
var i_clipright=1 
var content="" 
function initiate() { 
content+="<table border="+borderwidth+" cellpadding='5' width="+textwidth+" height="+textheight+">" 
content+="<tr><td bgcolor="+bg_ticker+" align="+alignmessage[i_message]+">" 
content+="<img hspace=5 src="+messageimg[i_message]+" align="+alignimg[i_message]+" border='0'>" 
content+="<a href="+messageurl[i_message]+" target="+target_url+">" 
content+="<font face="+font_face+" size="+font_size+" color="+font_color+">" 
content+=message[i_message] 
content+="</font></a></td></tr></table>" 
if (document.all) { 
for (i=0;i<=x_slices;i++) { 
var thisinners=eval("s"+i) 
thisinners.innerHTML=content 
var thiss=eval("document.all.s"+i+".style") 
thiss.posLeft=x_finalpos 
thiss.posTop=y_finalpos 
} 
i_message++ 
openlamellar() 
} 
if (document.layers) { 
for (i=0;i<=x_slices;i++) { 
var thisinners=eval("document.s"+i+".document") 
thisinners.write(content) 
thisinners.close() 
var thiss=eval("document.s"+i) 
thiss.left=x_finalpos 
thiss.top=y_finalpos 
} 
i_message++ 
openlamellarNN() 
} 
} 
function openlamellar() { 
clipleft=-width_slice 
clipright=0 
if (i_clipright<=width_slice) { 
for (i=0;i<=x_slices;i++) { 
var thiss=eval("document.all.s"+i+".style") 
thiss.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")" 
clipleft+=width_slice 
clipright=clipleft+i_clipright 
} 
i_clipright++ 
var timer=setTimeout("openlamellar()",20) 
} 
else { 
clearTimeout(timer) 
var timer=setTimeout("closelamellar()",3000) 
} 
} 
function openlamellarNN() { 
clipleft=-width_slice 
clipright=0 
if (i_clipright<=width_slice) { 
for (i=0;i<=x_slices;i++) { 
var thiss=eval("document.s"+i) 
thiss.clip.left=clipleft 
thiss.clip.right=clipright 
thiss.clip.top=cliptop 
thiss.clip.bottom=clipbottom 
clipleft+=width_slice 
clipright=clipleft+i_clipright 
} 
i_clipright++ 
var timer=setTimeout("openlamellarNN()",20) 
} 
else { 
clearTimeout(timer) 
var timer=setTimeout("closelamellarNN()",2000) 
} 
} 
function closelamellar() { 
clipleft=-width_slice 
clipright=0 
if (i_clipright>=0) { 
for (i=0;i<=x_slices;i++) { 
var thiss=eval("document.all.s"+i+".style") 
thiss.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")" 
clipleft+=width_slice 
clipright=clipleft+i_clipright 
} 
i_clipright-- 
var timer=setTimeout("closelamellar()",20)

} 
else { 
clearTimeout(timer) 
var timer=setTimeout("changeimage()",2000) 
} 
} 
function closelamellarNN() { 
clipleft=-width_slice 
clipright=0 
if (i_clipright>=0) { 
for (i=0;i<=x_slices;i++) { 
var thiss=eval("document.s"+i) 
thiss.clip.left=clipleft 
thiss.clip.right=clipright 
thiss.clip.top=cliptop 
thiss.clip.bottom=clipbottom 
clipleft+=width_slice 
clipright=clipleft+i_clipright 
} 
i_clipright-- 
var timer=setTimeout("closelamellarNN()",20)

} 
else { 
clearTimeout(timer) 
var timer=setTimeout("changeimageNN()",2000) 
} 
} 
function changeimage() { 
content="" 
if (i_message>message.length-1) {i_message=0} 
content+="<table border="+borderwidth+" cellpadding='5' width="+textwidth+" height="+textheight+">" 
content+="<tr><td bgcolor="+bg_ticker+" align="+alignmessage[i_message]+">" 
content+="<img hspace=5 src="+messageimg[i_message]+" align="+alignimg[i_message]+" border='0'>" 
content+="<a href="+messageurl[i_message]+" target="+target_url+">" 
content+="<font face="+font_face+" size="+font_size+" color="+font_color+">" 
content+=message[i_message] 
content+="</font></a></td></tr></table>" 
for (i=0;i<=x_slices;i++) { 
var thisinners=eval("s"+i) 
thisinners.innerHTML=content 
} 
i_message++ 
openlamellar() 
} 
function changeimageNN() { 
content="" 
if (i_message>message.length-1) {i_message=0} 
content+="<table border="+borderwidth+" cellpadding='5' width="+textwidth+" height="+textheight+">" 
content+="<tr><td bgcolor="+bg_ticker+" align="+alignmessage[i_message]+">" 
content+="<img hspace=5 src="+messageimg[i_message]+" align="+alignimg[i_message]+" border='0'>" 
content+="<a href="+messageurl[i_message]+" target="+target_url+">" 
content+="<font face="+font_face+" size="+font_size+" color="+font_color+">" 
content+=message[i_message] 
content+="</font></a></td></tr></table>" 
for (i=0;i<=x_slices;i++) { 
var thisinners=eval("document.s"+i+".document") 
thisinners.write(content) 
thisinners.close() 
} 
i_message++ 
openlamellarNN() 
} 
for (i=0;i<=x_slices;i++) { 
document.write("<span id='s"+i+"' class='s'></span>") 
} 
// - End of JavaScript - --> 
</SCRIPT>