Mouseover billede

2.

<img
onmouseover="this.src = 'stor.jpg' "
onmouseout="this.src = 'lille.jpg'"
src="lille.jpg">

1.
jeg kan ikke lige se der for mig, mener du at linket bliver erstattet af et billede, når man hopper hen over det?

eller at det dukker op i et fikset sted på siden?

1.

Jeg mener at mens man holder musen over link (bare et alm. text link) vises et billede, hvor f.eks billedets nederste venstre hjørne starter der hvor selve cursorens spids er.

her er et eksempel: http://www.templatemonster.com/flash-templates.php

Kig på denne side på de billeder til højre (nu ved jeg godt det er text-links jeg taler om, men det er vel det samme princip)

ahh.. jeg er desværre lidt træt i hovedet, så kan desværre ikke skive et brugerklart script.. men siden templatemonster allerede bruger et gratis script, kan du jo bruge deres...

/*
Simple Image Trail script- By JavaScriptKit.com
Visit http://www.javascriptkit.com for this script and more
This notice must stay intact
*/

var offsetfrommouse=[15,15]; //image x,y offsets from cursor position in pixels. Enter 0,0 for no offset
var displayduration=0; //duration in seconds image should remain visible. 0 for always.
var currentimageheight = 410;    // maximum image size.

var currentimagewidth = 490;    // maximum image size.
var timer;

function gettrailobj(){
if (document.getElementById)
return document.getElementById("preview_div").style
}

function gettrailobjnostyle(){
if (document.getElementById)
return document.getElementById("preview_div")
}


function truebody(){
return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}


function hidetrail(){   
    gettrailobj().display= "none";
    document.onmousemove=""
    gettrailobj().left="-500px"
    clearTimeout(timer);
}

function showtrail(imagename,title,showthumb){
    i = imagename
    t = title
    s = showthumb
    timer = setTimeout("show('"+i+"',t,s);",200);
}
function show(imagename,title,showthumb){
    var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth - offsetfrommouse[0]
    var docheight=document.all? Math.min(truebody().scrollHeight, truebody().clientHeight) : Math.min(window.innerHeight)

if( (navigator.userAgent.indexOf("Firefox")!=-1 || (navigator.userAgent.indexOf("Opera")==-1 && navigator.appVersion.indexOf("MSIE")!=-1)) && (docwidth>650 && docheight>500)) {

        document.onmousemove=followmouse;
   
        newHTML = '<div class="border_preview"><div id="loader_container"><div id="loader"><div align="center">Loading template preview...</div><div id="loader_bg"><div id="progress"> </div></div></div></div>';
        newHTML = newHTML + '<h2 class="title_h2">' + title + '</h2>'
        if (showthumb > 0){
            newHTML = newHTML + '<div class="preview_temp_load"><img onload="java script:remove_loading();" src="' + imagename + '" border="0"></div>';
        }

        newHTML = newHTML + '</div>';
        if(navigator.userAgent.indexOf("Firefox")==-1){
            newHTML = newHTML+'<iframe src="about:blank" scrolling="no" frameborder="0" width="390" height="390"></iframe>';
        }
        gettrailobjnostyle().innerHTML = newHTML;
        gettrailobj().display="block";
    }
}

function followmouse(e){

    var xcoord=offsetfrommouse[0]
    var ycoord=offsetfrommouse[1]

    var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth - offsetfrommouse[0]
    var docheight=document.all? Math.min(truebody().scrollHeight, truebody().clientHeight) : Math.min(window.innerHeight)

    if (typeof e != "undefined"){
        if (docwidth - e.pageX < currentimagewidth){
            if(navigator.userAgent.indexOf("Firefox")!=-1)    {xcoord = e.pageX - xcoord - currentimagewidth + 2*offsetfrommouse[0]} else{ xcoord = e.pageX - xcoord - currentimagewidth + 6*offsetfrommouse[0] ;} // Move to the left side of the cursor
            } else {
                xcoord += e.pageX;
            }
            if (docheight - e.pageY < (currentimageheight + 110)){
                ycoord += e.pageY - Math.max(0,(110 + currentimageheight + e.pageY - docheight - truebody().scrollTop));
            } else {
            ycoord += e.pageY;
            }
    } else if (typeof window.event != "undefined"){
        if (docwidth - event.clientX < currentimagewidth){
            xcoord = event.clientX + truebody().scrollLeft - xcoord - currentimagewidth + 2*offsetfrommouse[0]; // Move to the left side of the cursor
        } else {
            xcoord += truebody().scrollLeft+event.clientX
        }
        if (docheight - event.clientY < (currentimageheight + 110)){
            ycoord += event.clientY + truebody().scrollTop - Math.max(0,(110 + currentimageheight + event.clientY - docheight));
        } else {
            ycoord += truebody().scrollTop + event.clientY;
        }
    }

    var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-offsetfrommouse[0]
    var docheight=document.all? Math.max(truebody().scrollHeight, truebody().clientHeight) : Math.max(document.body.offsetHeight, window.innerHeight)
    if(ycoord < 0) { ycoord = ycoord*-1; }
    gettrailobj().left=xcoord+"px"
    gettrailobj().top=ycoord+"px"
}

du ligger så

onmouseover="showtrail('http://url-til-billede.jpg','overskift på billede',1)"  onmouseout="hidetrail()"

ind i dit <A> tag... f.eks

<A hiref="http://www.eksperten.dk/spm/705830" onmouseover="showtrail('http://www.eksperten.dk/img/elogo.png','Eksperten',1)"  onmouseout="hidetrail()">

jeg må hellere lige sige jeg ikke er den store html-helt.

Jeg forstår ikke helt den her du har lavet som ex:

<A hiref="http://www.eksperten.dk/spm/705830" onmouseover="showtrail('http://www.eksperten.dk/img/elogo.png','Eksperten',1)"  onmouseout="hidetrail()">

i link nummer 2: ,'eksperten',1 <--- Det er jeg ikke helt med på hvad der foregår der? Så vidt jeg forstod det, troede jeg at jeg bare skulle udskifte de 2 links, med mine billedfiler, men koden brokker sig lige så snart jeg piller ved link 2.

det måske en lidt for stor mundful for mig at forklare.. tror du skal have en der kender lidt bedre til at give fra sig :/

Der er sådan en automatisk drowdown eller popup placerer her ...
http://www.eksperten.dk/spm/702784

man kan selvfølgelig bare lægge det lille billede ind i den div der dukker frem - og hvis man så kører ind i den div og henover det billede så
<div... <img src="lillebillede.jpg" onmouseover="this.src='stortbillede.jpg';" onmouseout=this.src='lillebillede.jpg';" alt=""></div>

... ved ikke om det kan bruges ...

mclemens -> tror mit og dit prencip er det samme :P

Det afviser jeg skam ikke
- det var mere et andet script
der måske var mere overskuelig...

undskyld jeg er så uvidende, men er der ikke en der gider at lave et eksempel med den kode jeg skal bruge (hele koden så den bare kan indsættes)? Jeg kiggede på det link, mclemens, men jeg fatter hat af det :)

Et grimt eksempel (fjern mellemrum)
w w w.d ki f.com/users/mclemens/1/123.html

... scriptet skal man ikke spekulere så meget på - det klarer placeringen automatisk ... man kan selvfølgelig rykke det lidt til højre / venstre , op og ned som nævnt inde i linket ... det er svært at lave hele koden du skal bruge uden et link, oplysning om hvilket billede der skal dukke op hvor og under hvilken omstændighed...

Det script jeg lavede er der helt frit design i div'en d.v.s. det er bare at indsætte den billede switcher som freegeg foreslog - det har jeg så gjort på ovenstående link ... ved ikke om det er noget i den stil du leder efter...

det var lige præcis det jeg mente! det script vil jeg prøve at rode lidt med :)

Hvem vil ha point? i har jo begge hjulpet :)

[ Hvem vil ha point? i har jo begge hjulpet :) ]
Begge to er vel fair ... freegeg for img switcher'en

- og et svar her for scriptet :)

[ det var lige præcis det jeg mente! det script vil jeg prøve at rode lidt med :) ]
^ Det script der lægger på linket har jeg kørt en tekst erstatning på hidden -> none og visible -> block og visibility -> display - ellers er scriptet og menu'divs magen til det script og de menu'divs der står i den anden tråd ...

jeg behøver ikke point, har lært på denne tråd,det nok for mig :)

[ jeg behøver ikke point, har lært på denne tråd,det nok for mig :) ]
... sikke da noget snyd :/ ... nåh ... men tak for point
til både digitalpsyence og freegeg så :)

:)

Ja meget lærerigt, tak for hjælpen begge :)

tak for ros og point igen :)