| FAQ |
| Kalender |
2011-02-19, 17:46
|
#1 | ||
|
|||
|
Banned
|
Om jag har en bild på ett ställe på t. ex index-sidan - men vill att bilden skiftar till 2 alt 3 andra bilder löpande utan att använda Flash - hur går jag då tillväga?
Alla bilderna har exakt samma storlek. |
||
|
 Svara med citat
|
Byta bilder
|
2011-02-19, 17:53
|
#2 | ||
|
|||
|
Medlem
|
Isåfall låter Easy Slider som något för dig: http://cssglobe.com/post/5780/easy-s...-jquery-slider
|
||
|
|
Svara med citat
|
|
2011-02-20, 10:45
|
#3 | ||
|
|||
|
Flitig postare
|
Görs enkelt med javascript. Lägg bilden som en bakgrund i en div. Gör en timeout som skiftar bild på bakgrunden på din div. Krävs rätt lite kod för det. Inget behov av jquery för en sådan liten funktion.
|
||
|
|
Svara med citat
|
|
2011-02-20, 10:47
|
#4 | ||
|
|||
|
Banned
|
Nja, det var ingen "Slider" jag var ute efter - nåt som gör att den "fasta" bilden på sidan byter till en annan på samma plats. Gör man nån sorts länk till en annan bild då eller?
|
||
|
|
Svara med citat
|
|
2011-02-20, 11:12
|
#5 | ||
|
|||
|
Flitig postare
|
exempel:
*edit* Ändrade lite i precachen för att slippa skriva bild länkarna mer än en gång Kod:
<html>
<head>
<script type="text/javascript">
var myArrayPic= new Array();
myArrayPic[1] = "Bilder/bild1.jpg";
myArrayPic[2] = "Bilder/bild2.jpg";
myArrayPic[3] = "Bilder/bild3.jpg";
img1 = new Image();
img1.src = myArrayPic[1];
img2 = new Image();
img2.src = myArrayPic[2];
img3 = new Image();
img3.src = myArrayPic[3];
var MyCurrentPic = 1;
var MilliSecBetweenPicChange = 2000;
function NextBgPic(){
document.getElementById("MyPictureDiv").style.backgroundImage = "url('" + myArrayPic[MyCurrentPic] + "')";
if (MyCurrentPic != 3){
MyCurrentPic = MyCurrentPic + 1;
}
else {
MyCurrentPic = 1;
}
setTimeout("NextBgPic()", MilliSecBetweenPicChange);
}
</script>
</head>
<body>
<div id="MyPictureDiv" style="background-image: url('Bilder/bild1.jpg'); width:300px; height:400px;">
<div>
<script type="text/javascript">
NextBgPic();
</script>
</body>
</html>
Senast redigerad av P3N den 2011-02-20 klockan 11:27 |
||
|
|
Svara med citat
|
|
2011-02-20, 11:44
|
#6 | ||
|
|||
|
Banned
|
Tack! Då lägger jag bara in dne här koden där bilden är, right?
Å där du skrivit img1, img2 osv - där ska det stå bildens namn?? |
||
|
|
Svara med citat
|
|
2011-02-20, 11:54
|
#7 | ||
|
|||
|
Flitig postare
|
Ja, ändra bildnamnen där det i dag står "Bilder/bild1.jpg", "Bilder/bild2.jpg", "Bilder/bild3.jpg". Det skall stå den relativa vägen till dina bilder från sidan med detta scriptet.
Tänk på att lägga det som är mellan <head></head> taggarna mellan DINA head taggar och det i <body> taggarna i mellan DINA body taggar. Sen måste du sätta rätt width och height enligt dina bilder på diven där det nu står 300px och 400px. Samt positionera diven med bilden så att bilden hamnar på rätt ställe på sidan. Exempelvis: Kod:
<div id="MyPictureDiv" style="background-image: url('Bilder/bild1.jpg'); position:relative; top:300px; left: 200px; width:300px; height:400px;">
Senast redigerad av P3N den 2011-02-20 klockan 12:25 |
||
|
|
Svara med citat
|
|
2011-02-20, 13:22
|
#8 | ||
|
|||
|
Banned
|
Ok - stort tack P3N!
Då ska jag testa å lägga in varje JPG-image så. |
||
|
|
Svara med citat
|
|
2011-02-20, 15:31
|
#9 | ||
|
|||
|
Flitig postare
|
Det var så lite så
|
||
|
|
Svara med citat
|
| Svara |
«
Föregående ämne
|
Nästa ämne
»
| Ämnesverktyg | |
| Visningsalternativ | |
Linjär visning
|
|
Alla tider är GMT +2. Klockan är nu 05:53.