hur man gör mouseover bilder.

fick en fråga om hur man gör så att bilderna ändras när man drar musen över bilden så tänkte vara snäll och visa hur man gör så att ni också kan ta del av det. 

först måste du ha denna koden i alla kodmallarna precis ovanför </head>:

<script LANGUAGE="JavaScript"> <!-- // This is the implementation of SimpleSwap // by Jehiah Czebotar // Version 1.1 - June 10, 2005 // Distributed under Creative Commons // // Include this script on your page // then make image rollovers simple like: // <img src="/images/ss_img.gif" oversrc="/images/ss_img_over.gif"> // // http://jehiah.com/archive/simple-swap // function SimpleSwap(el,which){ el.src=el.getAttribute(which || "origsrc"); } function SimpleSwapSetup(){ var x = document.getElementsByTagName("img"); for (var i=0;i<x.length;i++){ var oversrc = x[i].getAttribute("oversrc"); if (!oversrc) continue; // preload image // comment the next two lines to disable image pre-loading x[i].oversrc_img = new Image(); x[i].oversrc_img.src=oversrc; // set event handlers x[i].onmouseover = new Function("SimpleSwap(this,'oversrc');"); x[i].onmouseout = new Function("SimpleSwap(this);"); // save original src x[i].setAttribute("origsrc",x[i].src); } } var PreSimpleSwapOnload =(window.onload)? window.onload : function(){}; window.onload = function(){PreSimpleSwapOnload(); SimpleSwapSetup();} //--> </script>

<script LANGUAGE="JavaScript">

<!--

// This is the implementation of SimpleSwap

// by Jehiah Czebotar

// Version 1.1 - June 10, 2005

// Distributed under Creative Commons

//

// Include this script on your page

// then make image rollovers simple like:

// <img src="/images/ss_img.gif" oversrc="/images/ss_img_over.gif">

//

// http://jehiah.com/archive/simple-swap

//

function SimpleSwap(el,which){

el.src=el.getAttribute(which || "origsrc");

}

function SimpleSwapSetup(){

var x = document.getElementsByTagName("img");

for (var i=0;i<x.length;i++){

var oversrc = x[i].getAttribute("oversrc");

if (!oversrc) continue;

// preload image

// comment the next two lines to disable image pre-loading

x[i].oversrc_img = new Image();

x[i].oversrc_img.src=oversrc;

// set event handlers

x[i].onmouseover = new Function("SimpleSwap(this,'oversrc');");

x[i].onmouseout = new Function("SimpleSwap(this);");

// save original src

x[i].setAttribute("origsrc",x[i].src);

}

}

var PreSimpleSwapOnload =(window.onload)? window.onload : function(){};

window.onload = function(){PreSimpleSwapOnload(); SimpleSwapSetup();}

//-->

</script>

• när du sedan skriver ett inlägg så skriver du klart inlägget därefter sparar du det i utkast,

sen ändrar du redigerare så kommer all text bli kodad form.

• beroende på var någonstans i inlägget du vill ha fotot, klistrar du in den här koden:

<img src="BILD 1" oversrc="BILD 2">

• vill du ha fotot längst upp, sätter du koden högst upp i inlägget, eller tvärtom om du vill ha det längst ner.

istället för Bild 1 (motsvarar bilden man ser från början) och Bild 2 (motsvarar bilden man ser när man drar musen över bilden) som det står i koden, klistrar du in adressen till dina bilder - och sen sparar du när du fortfarande är i den ändrade redigeraren.

• voila, svårare än så var det inte!
- har ni några frågor så tveka inte att fråga.

åh tacktacktacktack :D:D:D

kram!

Det funkar inte. Jag får inte den första (gömda bilden) ovan den andra.., när jag förhandsgranskar inlägget sedan.

det funkar faktist inte för mig!!!!

:(

skulle du kunna skicka ett mejl och hjälpa mig??