Kod för bildvisning

Raderad16 · 2 September 2007

Vet inte om detta är rätt ställe för den här sortens frågor men vi kör ändå. Säkert är det någon som är kunnig inom detta med kodning.

Hittade en kod för bildvisning på nätet. Men får inte det att funka. Bilderna kommer inte upp. Måste vara något fel men kan inte förstå vad.
Här kommer koden. Tror det kan ha med sökvägar att göra men är inte säker.
Hoppas någon kan hjälpa mig.
Tack på förhand-

<HTML>

<HEAD>
<TITLE>Mitt test</TITLE>
</HEAD>

<BODY>
<style type="text/css">
.viewer_main { border: solid black 0px; background-color: rgb(255,255,255); font-family: Arial; }
.viewer_win { background-color:rgb(255,255,255); border: solid black 0px; }
.viewer_button { width:18px; padding:3px; margin:2px; border:solid black 1px; background-color:white; text-align:center; font-size:12px; font-weight:bold; color:gray; cursor

ointer; }
</style>

<table class="viewer_main">
<tr>
<td style="width:400px;height:400px;vertical-align:middle;text-align:center;" class="viewer_win"><div style="overflow:auto;"><img src="" id="viewer_img" style="display:none;border:dotted gray 0px;"></div></td>
<td style="width:30px;height:400px;vertical-align:top;"><div id="viewer_info" style="height:400px;text-align:center;overflow:auto;"></div></td>
</tr>
</table>
<script type="text/javascript">
/* Detta script finns att hämta på http://www.jojoxx.net och
får användas fritt så länge som dessa rader står kvar. */

var images=[
"C:/Users/ONOFF/Desktop/Foto/KONSTIG.JPEG",
"C:\Users\ONOFF\Desktop\rosaperiod.JPEG",
];

// Ändra inte rader nedan.
var viewer={ width:400, height:400, slideshowdelay:2000 };
viewer.obj=document.getElementById('viewer_img');
viewer.picnr=0; viewer.picWidth=viewer.picHeight=0;
for(var n in images){
document.getElementById('viewer_info').innerHTML+="<div class=\"viewer_button\" style=\"\" onclick=\"if(viewer.activebutton){ viewer.activebutton.style.color=''; } viewer.activebutton=this; this.style.color='red'; viewer.load('"+images[n]+"');\">"+n+"</div>";
}
viewer.loader=new Image();
viewer.loader.onload=function(){
viewer.obj.src=viewer.loader.src;
viewer.picWidth=viewer.loader.width;
viewer.picHeight=viewer.loader.height;
if(viewer.picWidth>viewer.width||viewer.picHeight>viewer.height){
viewer.zoomFactor=Math.min((viewer.width-2)/viewer.picWidth,(viewer.height-2)/viewer.picHeight);
} else { viewer.zoomFactor=1; }
viewer.obj.width=Math.floor(viewer.picWidth*viewer.zoomFactor);
viewer.obj.height=Math.floor(viewer.picHeight*viewer.zoomFactor);
viewer.obj.style.display='inline';
}
viewer.load=function(str){
viewer.obj.style.display='none'; viewer.loader.src=str;
}
viewer.zoomTo=function(z){
z=(z)?parseFloat(z):viewer.zoomFactor;
viewer.obj.width=Math.floor(viewer.picWidth*z);
viewer.obj.height=Math.floor(viewer.picHeight*z);
}
viewer.slideshow=function(sw){
if(sw){
viewer.picnr=(viewer.picnr<images.length-1)?viewer.picnr+1:0; viewer.load(images[viewer.picnr]);
viewer.timer=setTimeout("viewer.slideshow(true);",viewer.slideshowdelay);
} else { if(viewer.timer){ clearTimeout(viewer.timer); viewer.timer=null; } }
}
viewer.filename=function(str){ return str.replace(/\\/g,"/").substring(str.replace(/\\/g,"/").lastIndexOf("/")+1); }
viewer.load(images[viewer.picnr]);
</script>

</BODY>
</HTML>

200cm · 2 September 2007

Du har dragit rätt slutsats när du antar att felet har med sökvägarna att göra. I javascript är "\" ett specialtecken, så för att ange dina Windows-sökvägar till bilderna måste du använda antingen "/" eller "\\".

Din kod flippar nog ur här:

var images=[
"C:/Users/ONOFF/Desktop/Foto/KONSTIG.JPEG",
"C:\Users\ONOFF\Desktop\rosaperiod.JPEG",
];

Byt ut alla "\" mot "/" eller "\\" i kodpartiet ovan, och testa igen!

Raderad16 · 2 September 2007

Fungerar ej!

Jag försökte med båda tecken du visade.
"\\" fungerade inte alls.
Däremot "/" funkar bättre. Får upp små rutor med en nolla och etta på webläsaren. Men när man ska klicka på dem kommer bilden inte upp.

Har du någon aning om varför?
Sedan skulle jag nog vilja ha små tumnaglar för att välja ifrån inte siffror.
Så som det är tänkt att det skall se ut finns här att titta på:
http://www.jojoxx.net/jscript/archive/show.asp?id=109

Tacksam för ditt svar och hjälp.
Mvh Lena

Lysmask · 2 September 2007

Syntaxen ska var såhär om du vill peka på filer lokalt.

var images=[
"file:///C:/bilder/rf2.jpg",
"file:///C:/bilder/rf3.jpg",
];

osv. viktigt med tre / i början och sen att de är åt rätt håll i sökvägen sen.. alltså / istället för \

Ie accepterar säkert blandade / och \ men inte firefox.

lastrand · 2 September 2007

Jag får det att fungera bra genom att ändra koden till följande:

var images=[
"foto/bild1.jpg",
"foto/bild2.jpg",
];

Gurra G · 2 September 2007

undrar om det kan vara så här enkelt för att få tumnaglar istället för siffror?

detta läggs till:
var thumbs=[
"sökväg till tumnagel",
"sökväg till tumnagel",
];

och raden
viewer.load('"+images[n]+"');\">"+n+"</div>";
}
ändras till
viewer.load('"+images[n]+"');\">"+thumbs[n]+"</div>";
}

har inte testat men det kan funka, om tumnaglarna har rätt storlek (18px bredd?)

Raderad16 · 2 September 2007

Fungerar

Tack vare alla era råd har jag fått det att fungera nu.
Den visar siffror fortfarande. Det funkade inte med koden för att få tumnaglar istället.
Fler råd tages tacksamt emot

Eller har ni rentav andra tips till bra bildscript till en hemsida.
Den nuvarande hemsidan är omständig att ändra och lägga till bilder i.
Vill ha ett som ser proffsigt ut.

Mvh Lena

Gurra G · 2 September 2007

hmmmm.... nu blev det personligt, återkommer snart, det ska väl inte vara så himla svårt att visa bidler istf siffror?

nu då, gick visst lite för fort imorse

viewer.load('"+images[n]+"');\"><img src=\""+thumbs[n]+"\"></div>";
}

Forum

Kod för bildvisning

Raderad16

Avslutat medlemskap

200cm

Aktiv medlem

Raderad16

Avslutat medlemskap

Lysmask

Avslutat medlemskap

lastrand

Avslutat medlemskap

Gurra G

Aktiv medlem

Raderad16

Avslutat medlemskap

Gurra G

Aktiv medlem

Similar threads