/ Forside / Teknologi / Udvikling / Java Scripts / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
foto der flytter sig
Fra : Ukendt


Dato : 10-03-04 17:28

Hej NG

er der en venlig sjæl, der kender et javascript, der kan få en række foto
til at flytte sig, når man holder musen over til 2 små pile. Sagt på en
anden måde. Hvis man holder musen over den venstrepil flytter fotorækken sig
til venstre og ligeså med den højrepil.

På forhånd tak

Mette



 
 
Jens Peter Karlsen (10-03-2004)
Kommentar
Fra : Jens Peter Karlsen


Dato : 10-03-04 22:50

Det her burde nemt kunne tilrettes til formålet:

<html>

<head>
<meta http-equiv="Content-Type" content="text/html;
charset=windows-1252">

<SCRIPT LANGUAGE="JavaScript">
<!-- Original: Mike Canonigo (mike@canonigo.com) -->
<!-- Web Site: http://www.munkeehead.com -->

<!-- Modyfied by Jens Peter Karlsen 2003 -->

<!-- Begin
NewImg = new Array (
"images/1.jpg",
"images/2.jpg",
"images/3.jpg"
);

var p = NewImg.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = NewImg[i];
}
var ImgNum = 0;
var ImgLength = NewImg.length - 1;

//Time delay between Slides in milliseconds
var delay = 3000;
var t;
var lock = false;
var run;
function chgImg(direction) {

if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SlideShow.filters.blendTrans.Apply();
}
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}

if (document.images) {
ImgNum = ImgNum + direction;
if (ImgNum > ImgLength) {
ImgNum = 0;
}
if (ImgNum < 0) {
ImgNum = ImgLength;
}
document.SlideShow.src = NewImg[ImgNum];
}
}

function auto() {
if (lock == true) {
lock = false;
window.clearInterval(run);
}
else if (lock == false) {
lock = true;
run = setInterval("chgImg(1)", delay);
}
}

// End -->
</script>

</head>

<body>
<img src="images/1.jpg" name="SlideShow" width="125" height="100">
<table>
<tr>
<td align="right"><a href="javascript:chgImg(-1)">Previous</a></td>
<td align="center"><a href="javascript:auto()">Auto/Stop</a></td>
<td align="left"><a href="javascript:chgImg(1)">Next</a></td>
</tr>
</table>

</body>
</html>


Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.

On Wed, 10 Mar 2004 17:28:26 +0100, "Mette" <invalid> wrote:

>er der en venlig sjæl, der kender et javascript, der kan få en række foto
>til at flytte sig, når man holder musen over til 2 små pile. Sagt på en
>anden måde. Hvis man holder musen over den venstrepil flytter fotorækken sig
>til venstre og ligeså med den højrepil.


Cocktail-Henning ;-) (11-03-2004)
Kommentar
Fra : Cocktail-Henning ;-)


Dato : 11-03-04 13:07

Mette wrote in dk.edb.internet.webdesign.clientside noed i denne stil:

... en række foto til at flytte sig, ....

Hvis man holder musen over ...
....så stopper samlebåndet...

og hvis man klikker på foto - så popper et større foto op ...
>
Ja mette!

Det lyder som om mit samlebånd ku klare det!
indsæt i body delen på din side denne her...
<script language="JavaScript1.2" src="samlebaand.js"></script>

lav 2 mapper
eet med små billeder thumbnails
der hedder fotos_th/
og hvor fotos hedder tn_01.jpg etc op til tn_99.jpg

eet med større fotos
der hedder fotos/
og hvor fotos hedder
01.jpg op til 99.jpg

altså lav en vis systematik - med navnene...!
de 2 foldere er smarte at have hvis du har mange og STORE fotos !!!
det er sq tungt at hente ind !!

find "easythumbnail" creater på:
http://www.fookes.com/ezthumbs/index.php
den er alle tiders - og gratis

og lav så et "samlebaand.js" som fil med flg indhold:
!!!! husk at rette antal (her 16) !!!

<!-- indhold af samlebaand.js -----
// henning har tilrettet og gjort ved per 28jan2004

var iMax=16 // her er antal Henning
preting= 'fotos_th/tn_'; // her er path til thumbnails dem i båndet!!!!!!!!
Henning thumbs hedder "tn_01.jpg" etc
pretingref= 'fotos/'; // her er path til store fotos !!!!
Henning fotos hedder "01.jpg" etc

//---------------------------------------------------------

/*
Conveyor belt slideshow script-
© Dynamic Drive (www.dynamicdrive.com)
For full source code, 100's more DHTML scripts, and Terms Of Use, visit
dynamicdrive.com
*/


//Specify the slider's width (in pixels)
var sliderwidth="600px" // 300
//Specify the slider's height // 150
var sliderheight="110px"
//Specify the slider's slide speed (larger is faster 1-10)
var slidespeed= 3 // 3
//configure background color:
slidebgcolor="#EAEAEA"

//Specify the slider's images
var leftrightslide=new Array()
var finalslide=''

var aa='';
var thsuf = ''; // evt '_th'
var ting='';
var tingref ='';



for (i=1;i<=iMax; i++)
{
aa='';
if (i<10) { aa='0' }

ting = preting + aa + i + thsuf + '.jpg';
tingref = pretingref + aa + i + '.jpg';

leftrightslide[i]=
'<a href="'+ tingref +'" target="_blank">'
+ '<img src="' + ting + '" border=1 width=150 height=100>';
+ '</a>'
//document.write( ting );
}
//------------------------------------------------------

////NO NEED TO EDIT BELOW THIS LINE////////////

var copyspeed=slidespeed
leftrightslide='<nobr>'+leftrightslide.join(" ")+'</nobr>'
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp"
style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+leftright
slide+'</span>')
var actualwidth=''
var cross_slide, ns_slide

function fillup(){
if (iedom){
cross_slide=document.getElementById? document.getElementById("test2") :
document.all.test2
cross_slide2=document.getElementById? document.getElementById("test3") :
document.all.test3
cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide
actualwidth=document.all? cross_slide.offsetWidth :
document.getElementById("temp").offsetWidth
cross_slide2.style.left=actualwidth+20+"px"
}
else if (document.layers){
ns_slide=document.ns_slidemenu.document.ns_slidemenu2
ns_slide2=document.ns_slidemenu.document.ns_slidemenu3
ns_slide.document.write(leftrightslide)
ns_slide.document.close()
actualwidth=ns_slide.document.width
ns_slide2.left=actualwidth+20
ns_slide2.document.write(leftrightslide)
ns_slide2.document.close()
}
lefttime=setInterval("slideleft()",30)
}
window.onload=fillup

function slideleft(){
if (iedom){
if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))
cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px"
else
cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+30+"px"

if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))
cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px"
else
cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+30+"px"

}
else if (document.layers){
if (ns_slide.left>(actualwidth*(-1)+8))
ns_slide.left-=copyspeed
else
ns_slide.left=ns_slide2.left+actualwidth+30

if (ns_slide2.left>(actualwidth*(-1)+8))
ns_slide2.left-=copyspeed
else
ns_slide2.left=ns_slide.left+actualwidth+30
}
}


if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div
style="position:relative;width:'+sliderwidth+';height:'+sliderheight+';overflow
:hidden">')
write('<div
style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';backgrou
nd-color:'+slidebgcolor+'" onMouseover="copyspeed=0"
onMouseout="copyspeed=slidespeed">')
write('<div id="test2" style="position:absolute;left:0px;top:0px"></div>')
write('<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+sliderwidth+' height='+sliderheight+'
name="ns_slidemenu" bgColor='+slidebgcolor+'>')
write('<layer name="ns_slidemenu2" left=0 top=0 onMouseover="copyspeed=0"
onMouseout="copyspeed=slidespeed"></layer>')
write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0"
onMouseout="copyspeed=slidespeed"></layer>')
write('</ilayer>')
}
document.write('</td></table>')
}
}
//-->



--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Søg
Reklame
Statistik
Spørgsmål : 177558
Tips : 31968
Nyheder : 719565
Indlæg : 6408926
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste