Ticker boven links aanroepen

Status
Niet open voor verdere reacties.

uaejeroen

Terugkerende gebruiker
Lid geworden
7 dec 2009
Berichten
1.665
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body {
	background-image: url(afbeeldingen/ACHTERGROND.jpg);
}
</style>
</head>

<body>
<center>


  <p><a href="index.html">    Home</a> Blog Kavels Fotogallerij
  </p>
</center>
</body>
</html>

dit is mijn index

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<style>
<!--
.scrollerstyle{
font-family:webdings;background:#FFFFFF;border:1px solid #000000;cursor:hand;
}
-->
</style>

<script language="javascript">

//News Bar script- By Premshree Pillai (premshree@hotmail.com)
//http://www.qiksearch.com/javascripts.htm
//Enhancements by Dynamic Drive
//Visit http://www.dynamicdrive.com for this script

 var msgs = new Array(
     "Click here to go back to Dynamic Drive",
     "JavaScript Kit- free scripts and tutorials",
     "Freewarejava.com",
     "Wired News- Technology and beyond",
     "Qiksearch.com" ); // No comma after last ticker msg

 var msg_url = new Array(
     "http://www.dynamicdrive.com",
     "http://www.javascriptkit.com",
     "http://freewarejava.com",
     "http://www.wired.com",
     "http://www.qiksearch.com" ); // No comma after last ticker url

var barwidth='350px' //Enter main bar width in px or %
var setdelay=3000 //Enter delay between msgs, in mili-seconds
var mouseover_color='#E1FFE1' //Specify highlight color
var mouseout_color='#FFFFFF' //Specify default color
/////////////////////////////////////////////////////////////////////

var count=0;
var ns6=document.getElementById&&!document.all
var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1

if (ie4||ns6){
document.write('<form name="news_bar"><input type="button" value="3" onclick="moveit(0)" class="scrollerstyle" style="width:22px; height:22px; border-right-width:0px;" name="prev" title="Previous News"><input type="button" name="news_bar_but" onclick="goURL();" style="color:#000000;background:#FFFFFF; width:'+barwidth+'; height:22px; border-width:1; border-color:#000000; cursor:hand" onmouseover="this.style.background=mouseover_color" onmouseout="this.style.background=mouseout_color"><input type="button" value="4" onclick="moveit(1)" class="scrollerstyle" style="width:22px; height:22px; border-left-width:0px;" name="next" title="Next News"></form>');
}
else{
document.write('<form name="news_bar"><input type="button" value="Previous" onclick="moveit(0)">')
if (navigator.userAgent.indexOf("Opera")!=-1)
document.write('<input type="button" name="news_bar_but" onclick="goURL();" style="width:'+barwidth+'" border="0">')
else
document.write('<input type="button" name="news_bar_but" onclick="goURL();" width="'+barwidth+'" border="0">')
document.write('<input type="button" value="Next" onclick="moveit(1)"></form>')
}

function init_news_bar(){
  document.news_bar.news_bar_but.value=msgs[count];
}
//moveit function by Dynamicdrive.com
function moveit(how){
if (how==1){ //cycle foward
if (count<msgs.length-1)
count++
else
count=0
}
else{ //cycle backward
if (count==0)
count=msgs.length-1
else
count--
}
document.news_bar.news_bar_but.value=msgs[count];
}

setInterval("moveit(1)",setdelay)

function goURL(){
 location.href=msg_url[count];
}

init_news_bar();

</script>
</body>
</html>

dit is een apparte html bestandje die ik extern wil aanroepen

hoe kan dat?

<input...?

Graag advies
 
?

Hallo uaejeroen,

Eigenlijk snap ik niet wat je bedoeld.

Wil je de Ticker-code los hebben zodat je deze
overal kan plaatsen ? Dit kan zo :

1 - Knip alles wat tussen de JavaScript-tags staat eruit.
(dus tussen <script language="javascript">
en </script>

//News Bar script- By Premshree Pillai (premshree@hotmail.com)
//http://www.qiksearch.com/javascripts.htm
//Enhancements by ....
...
...
...
location.href=msg_url[count];
}

init_news_bar();

2 - Open een eenvoudige tekstverwerker (Notepad is prima)
en plak het zojuist geknipte hier.
3 - Opslaan met een handige naam en het JavaScript-achtervoegsel
Bv. Ticker.js

Nu kun je voortaan overal & in elke pagina de Ticker plaatsen.
Dit doe je door in de gewenste pagina te verwijzen naar het
net gemaakte bestand met de Ticker-code :

<script type="text/javascript" src="Ticker.js"></script>

De bovenstaande regel moet wel tussen de body-tags staan
en niet in de <style> maar beter na </style>

Dacht dat je zoiets voor elkaar wilt krijgen.

De teksten zijn aan te passen bij :
var msgs = new Array
met de bijbehorende links in :
var msg_url = new Array


index.html is veelal de eerste pagina van een web-site.
Van hieruit worden bezoekers doorgelinkt.
Dus logisch is dat index.html je allereerste pagina is.

Hoop dat je hier iets aan hebt.
 
Laatst bewerkt:
beste als je het zip bestand hebt uitgepakt zie je dat deze pagina is opgelagen als .html

ik weet hoe je dat met javascript kan aanroepen maar dat lukt niet met een html pagina
 
<script type="text/javascript" src="js/image-slideshow.js">
/***********************************************************************************************

Copyright (c) 2005 - Alf Magne Kalleland post@dhtmlgoodies.com

UPDATE LOG:

March, 10th, 2006 : Added support for a message while large image is loading

Get this and other scripts at www.dhtmlgoodies.com

You can use this script freely as long as this copyright message is kept intact.

***********************************************************************************************/


</script>

Dus alleen dit
 
Het hele stuk TUSSEN <script language="javascript"> en </script> is JavaScript.
Dit stuk plaats je in een nieuw bestand, genaamd: Ticker.js

Deze twee tags zelf worden verandert in :
<script type="text/javascript" src="Ticker.js"></script>
dat zegt dat de JavaScript-code nu NIET ERTUSSEN staat maar
eerst ingelezen moet worden uit het bestand Ticker.js

Op deze manier kun je met een regel telkens de externe code
(her-)gebruiken zonder telkens opnieuw te hoeven typen.
 
nou ik heb het hele bestand opgeslagen in.js en het werkt niet

krijg allemaal fout berichten
 
Sorry sorry ik was helemaal de draad kwijt

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>Image slideshow</title>
	<link rel="stylesheet" href="css/image-slideshow.css" type="text/css">
	<script type="text/javascript" src="js/image-slideshow.js">
   	/***********************************************************************************************
	
	Copyright (c) 2005 - Alf Magne Kalleland post@dhtmlgoodies.com
	
	UPDATE LOG:
	
	March, 10th, 2006 : Added support for a message while large image is loading
	
	Get this and other scripts at www.dhtmlgoodies.com
	
	You can use this script freely as long as this copyright message is kept intact.
	
	***********************************************************************************************/ 
 
	
	</script>
</head>
<body>
<div id="dhtmlgoodies_slideshow">
	<div id="previewPane">
		<img src="images/image1_big.jpg">
		<span id="waitMessage">Loading image. Please wait</span>	
		<div id="largeImageCaption">This is the caption of image number 1</div>
	</div>
	<div id="galleryContainer">
		<div id="arrow_left"><img src="images/arrow_left.gif"></div>
		<div id="arrow_right"><img src="images/arrow_right.gif"></div>
		<div id="theImages">
				<!-- Thumbnails -->
				<a href="#" onclick="showPreview('images/image1_big.jpg','1');return false"><img src="images/image1.jpg"></a>		
				<a href="#" onclick="showPreview('images/image2_big.jpg','2');return false"><img src="images/image2.jpg"></a>		
				<a href="#" onclick="showPreview('images/image3_big.jpg','3');return false"><img src="images/image3.jpg"></a>		
				<a href="#" onclick="showPreview('images/image4_big.jpg','4');return false"><img src="images/image4.jpg"></a>		
				<a href="#" onclick="showPreview('images/image5_big.jpg','5');return false"><img src="images/image5.jpg"></a>		
				<a href="#" onclick="showPreview('images/image6_big.jpg','6');return false"><img src="images/image6.jpg"></a>		
				<a href="#" onclick="showPreview('images/image7_big.jpg','7');return false"><img src="images/image7.jpg"></a>		
				<a href="#" onclick="showPreview('images/image8_big.jpg','8');return false"><img src="images/image8.jpg"></a>	
				<!-- End thumbnails -->
				
				<!-- Image captions -->	
				<div class="imageCaption">This is the caption of image number 1</div>
				<div class="imageCaption">This is the caption of image number 2</div>
				<div class="imageCaption">This is the caption of image number 3</div>
				<div class="imageCaption">This is the caption of image number 4</div>
				<div class="imageCaption">This is the caption of image number 5</div>
				<div class="imageCaption">This is the caption of image number 6</div>
				<div class="imageCaption">This is the caption of image number 7</div>
				<div class="imageCaption">This is the caption of image number 8</div>
				<!-- End image captions -->
				
				<div id="slideEnd"></div>
		</div>
	</div>
</div>
</body>
</html>

Ik was met een hele andere bezig vandaar dat ik <script nergens zag

Hoe kan ik dit extern aanroepen
 
Dit is een nieuwe vraag

[JS]<div style="position:relative;left:0px;top:0px">
<span id="highlighter" style="position:absolute;left:0;top:0;font-size:18px;font-family:Verdana;background-color:yellow;clip:rect(0px 0px auto 0px)"></span>
</div>

<script type="text/javascript" src="ticker.js"></script>



/*
Highligher Scroller script- By JavaScript Kit
For this and over 400+ free scripts, visit http://www.javascriptkit.com/
This notice must stay intact
*/

var tickercontents=new Array()
tickercontents[0]='Looking for free Java applets and resources? Visit <a href="http://freewarejava.com">Freewarejava.com</a>!'
tickercontents[1]='Hop on over to <a href="http://www.codingforums.com">Coding Forums</a> to get help on web coding!'
tickercontents[2]='This scroller\'s brought to you by <a href="http://www.javascriptkit.com">JavaScript Kit</a>'

var tickdelay=3000 //delay btw messages
var highlightspeed=10 //10 pixels at a time.

////Do not edit pass this line////////////////

var currentmessage=0
var clipwidth=0

function changetickercontent(){
crosstick.style.clip="rect(0px 0px auto 0px)"
crosstick.innerHTML=tickercontents[currentmessage]
highlightmsg()
}

function highlightmsg(){
var msgwidth=crosstick.offsetWidth
if (clipwidth<msgwidth){
clipwidth+=highlightspeed
crosstick.style.clip="rect(0px "+clipwidth+"px auto 0px)"
beginclip=setTimeout("highlightmsg()",20)
}
else{
clipwidth=0
clearTimeout(beginclip)
if (currentmessage==tickercontents.length-1) currentmessage=0
else currentmessage++
setTimeout("changetickercontent()",tickdelay)
}
}

function start_ticking(){
crosstick=document.getElementById? document.getElementById("highlighter") : document.all.highlighter
crosstickParent=crosstick.parentNode? crosstick.parentNode : crosstick.parentElement
if (parseInt(crosstick.offsetHeight)>0)
crosstickParent.style.height=crosstick.offsetHeight+'px'
else
setTimeout("crosstickParent.style.height=crosstick.offsetHeight+'px'",100) //delay for Mozilla's sake
changetickercontent()
}

if (document.all || document.getElementById)
window.onload=start_ticking

</script>

<p align="left">This free script provided by<br />
<a href="http://javascriptkit.com">JavaScript Kit</a></p>// JavaScript Document[/JS]

Hier krijg ik foutmelding op lijn vijf

ook als ik het zonder uw advvies probeer
 
Ticker Compleet

Sorry, ik ben 'n slechte leraar, ik probeer het zo:

Hieronder eerst de index.html inhoud :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body {
background-image: url(afbeeldingen/ACHTERGROND.jpg);
}
.scrollerstyle{
font-family:webdings;
background:#FFFFFF;
border:1px solid #000000;
cursor:hand;
}
</style>
</head>


<body>
<center>

<p>
<a href="index.html">Home</a> Blog Kavels Fotogallerij
</p>

<!-- Hieronder de verwijzing naar 't externe
Ticker-JavaScript-bestand: (Ticker.js) -->
<script type="text/javascript" src="Ticker.js"></script>

<p>
<h3>! Je kunt maar 1 ticker per pagina plaatsen !</h3>
</p>

</center>

</body>

</html>


En hieronder de Ticker.js inhoud :


//News Bar script- By Premshree Pillai (premshree@hotmail.com)
//http://www.qiksearch.com/javascripts.htm
//Enhancements by Dynamic Drive
//Visit http://www.dynamicdrive.com for this script

var msgs = new Array(
"Click here to go back to Dynamic Drive",
"JavaScript Kit- free scripts and tutorials",
"Freewarejava.com",
"Wired News- Technology and beyond",
"Qiksearch.com" ); // No comma after last ticker msg

var msg_url = new Array(
"http://www.dynamicdrive.com",
"http://www.javascriptkit.com",
"http://freewarejava.com",
"http://www.wired.com",
"http://www.qiksearch.com" ); // No comma after last ticker url

var barwidth='350px' //Enter main bar width in px or %
var setdelay=3000 //Enter delay between msgs, in mili-seconds
var mouseover_color='#E1FFE1' //Specify highlight color
var mouseout_color='#FFFFFF' //Specify default color
/////////////////////////////////////////////////////////////////////

var count=0;
var ns6=document.getElementById&&!document.all
var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1

if (ie4||ns6){
document.write('<form name="news_bar"><input type="button" value="3" onclick="moveit(0)" class="scrollerstyle" style="width:22px; height:22px; border-right-width:0px;" name="prev" title="Previous News"><input type="button" name="news_bar_but" onclick="goURL();" style="color:#000000;background:#FFFFFF; width:'+barwidth+'; height:22px; border-width:1; border-color:#000000; cursor:hand" onmouseover="this.style.background=mouseover_color" onmouseout="this.style.background=mouseout_color"><input type="button" value="4" onclick="moveit(1)" class="scrollerstyle" style="width:22px; height:22px; border-left-width:0px;" name="next" title="Next News"></form>');
}
else{
document.write('<form name="news_bar"><input type="button" value="Previous" onclick="moveit(0)">')
if (navigator.userAgent.indexOf("Opera")!=-1)
document.write('<input type="button" name="news_bar_but" onclick="goURL();" style="width:'+barwidth+'" border="0">')
else
document.write('<input type="button" name="news_bar_but" onclick="goURL();" width="'+barwidth+'" border="0">')
document.write('<input type="button" value="Next" onclick="moveit(1)"></form>')
}

function init_news_bar(){
document.news_bar.news_bar_but.value=msgs[count];
}
//moveit function by Dynamicdrive.com
function moveit(how){
if (how==1){ //cycle foward
if (count<msgs.length-1)
count++
else
count=0
}
else{ //cycle backward
if (count==0)
count=msgs.length-1
else
count--
}
document.news_bar.news_bar_but.value=msgs[count];
}

setInterval("moveit(1)",setdelay)

function goURL(){
location.href=msg_url[count];
}

init_news_bar();
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan