Sida 1 av 1
Byta bild på min hemsida.
Postat: 06 jun 2009, 17:26
av Forcevision
Tjabba !
Sitter här och kodar lite på min hemsida. Och nu hoppas jag på hjälp från er. Någon som har en kod eller en sida som kan fixa så jag får mina bilder att bli ett bildspel på min hemsida. Skall förklara lite, har en hemsida som jag vill ha 3st bilder som kommer fram en i taget och så loopas dessa bilderna.
Hoppas på hjälp med detta.
/Force
Re: Byta bild på min hemsida.
Postat: 06 jun 2009, 18:05
av serialsniffer
hmm javascript med en timer på några sekunder och när tiden gått ut körs en funktion som byter bild kanske?
Re: Byta bild på min hemsida.
Postat: 06 jun 2009, 22:41
av perab
Hej, Forcevision!
Kan detta vara något för dig? Lösningen bygger på Javascript. Lämpligt är väl att du också låter den viktigaste bilden visas om Javascript är avstängt.
http://wsabstract.com/script/script2/in ... lide.shtml
Per
Edit: Rättat ett stavfel.
Re: Byta bild på min hemsida.
Postat: 07 jun 2009, 09:02
av ycc
perabs länk verkar ju ge en färdig lösning, vad bra.
Själv har jag använt getelementbyid och settimeout. Vi har haft frågan uppe tidigare:
http://ubuntu-se.org/phpBB3/viewtopic.p ... 59#p271791
(fast i den tråden vill jag minnas att man inte skulle ge färdiga lösningar eftersom trådskaparen var student som skulle skriva en egen uppsats/program)
Här står hur man använder getelementbyid för att byta bild:
http://www.w3schools.com/JS/tryit.asp?f ... _image_src
Vill man ha mjuka övergångar kan man lägga bilderna ovanpå varandra och påverka transparens-index med javaskript och settimeout. (Det finns ett bra rutiner för det i ett bibliotek på nätet som heter blendtrans. Håller men på med det så skall man komma ihåg IE-buggen: För att ändra genomskinlighet så måste man ange en storlek (px) på bilden i bildtaggen, annars funkar det inte i IE, vill jag minnas.)
Här roteras bilder/divtaggar på några kända figurer
http://web.telia.com/~u17103363/doc/Ubu ... m#Bakgrund
Re: Byta bild på min hemsida.
Postat: 09 jun 2009, 08:20
av ycc
Jag hittade en bit kod i skafferiet och kopierade in de två första avatarerna i denna tråden. Det behöver alltså inte vara så lång eller komplicerad kod för att växla några bilder. (Sedan skall det ju göras till en riktig web-sida med doctype, header etc. förstås.)
http://web.telia.com/~u17103363/doc/sw_tst.htm
Kod: Markera allt
<script type="text/javascript">
var b = 0;
function changeSrc() {
if (b==1){
document.getElementById("myImage").src="http://ubuntu-se.org/phpBB3/download/file.php?avatar=8465_1220519925.jpg";
b=0;
} else
if (b==0){
document.getElementById("myImage").src="http://ubuntu-se.org/phpBB3/download/file.php?avatar=11255_1229171490.jpeg";
b=1;
}
window.setTimeout("changeSrc()", 4000); // 4 sec
}
</script>
<body onload="changeSrc()">
<img id="myImage" src="http://ubuntu-se.org/phpBB3/download/file.php?avatar=8465_1220519925.jpg" />
</body>
Re: Byta bild på min hemsida.
Postat: 09 jun 2009, 09:16
av ajja
Ytterligare en variant med javascript.
Tids aspekten sätter du vid 'setTimeout'.
Bilderna måste ligga i ordningen, den sista först och den första som andra bild.
'onLoad="rotate()"' i body-taggen är den som talar om för FF (har endast testat med FF) att den ska ladda en rotera-funktion och ankar-taggen lägger du där du vill ha bildspelet i kroppen.
Kod: Markera allt
<SCRIPT LANGUAGE=JAVASCRIPT TYPE="TEXT/JAVASCRIPT">
<!-- Dölj skript för äldre webbläsare
adImages = new Array("bann/img7.png","bann/img1.png","bann/img2.png","bann/img3.png","bann/img4.png","bann/img5.png","bann/img6.png")
thisAd = 0
imgCt = adImages.length
function rotate() {
if (document.images) {
if (document.adBanner.complete) {
thisAd++
if (thisAd == imgCt) {
thisAd = 0
}
document.adBanner.src=adImages[thisAd]
}
setTimeout("rotate()", 4 * 1000)
}
}
// Sluta dölj skript -->
</SCRIPT>
<BODY onLoad="rotate()">
<A HREF="javascript:newLocation()"><IMG SRC="bann/img1.jpg" WIDTH=150 HEIGHT=160 NAME="adBanner" BORDER=0></A>
Re: Byta bild på min hemsida.
Postat: 09 jun 2009, 12:11
av P.Forsberg