Hitta felet, det var en liten fel stavning vid:
CB.addEvent(arr[i], "click", jungelBoggie.change);
som ska vara
CB.addEvent(arr[i], "click", jungelBoogie.change);
Frågan#1
Hej,
Jag håller på med ett javascript där bilder ska visas, till mitt bildgalleri :) som ser ltie snyggt ut men nu ska jag göra om visningsdelen och det görs i Javascript bara för det e lite snyggare.
Detta är bara ett exempel, bara för utvecklings delen, så dessa storlekar kommer inte användas men det är bara för utvecklings syftet.
desingen är så här:
<!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>Namnlöst dokument</title>
<style type="text/css">
#imageShower {
width:300px;
padding:10px;
border:1px solid #000;
}
.main {
width:280px;
height:280px;
margin:10px;
}
</style>
</head>
<body>
<a href="index.html">Hem</a> / <a href="bild.html">Bild</a><br/>
<p>
</p>
<div id="imageShower">
<img src="bild.jpg" class="main" width="70" height="70"/><br/>
<img src="Chrysanthemum.jpg" width="70" height="70"/>
<img src="Desert.jpg" width="70" height="70"/>
<img src="Koala.jpg" width="70" height="70"/>
</div>
<script type="text/javascript" src="skript.js"></script>
</body>
</html>
Och filen skritp.js ser ut
// JavaScript Document
var CB = {
addEvent : function(element, event, action){
if(element.addEventListener){
element.addEventListener(event, action, false);
}
else{
element.attachEvent("on" + event, action);
}
}
}
var jungelBoogie = {
main : function(id){
var arr = id.childNodes;
for(var i = 0; i < arr.length; i++){
if(arr[i].nodeName == "IMG"){
CB.addEvent (arr[i], "click", jungelBoggie.change);
}
}
},
change : function(e){
if(window.event){
var target = window.event.srcElement;
}else{
var target = e.target;
}
var main_img = target.parentNode.getElementsByTagName("img")[0];
var newSrc = target.src;
var oldSrc = main_img.src;
main_img.src = newSrc;
target.src = oldSrc;
}
}
var pb = document.getElementById("imageShower");
jungelBoogie.main(pb);
det inte vad som e fel, om det e css, eller javascriptet i sig :/ är ny i detta. så hjälp tack:)
I exemplet så e en bild i fokus alltså den e över allt, sen dem som e under där(3st bilder) ska vara lite minde i detta exempel 70x70.