Avatar billede smask Nybegynder
29. juli 2001 - 21:31 Der er 33 kommentarer og
1 løsning

mouseover ?

Jeg har lige et spørgsmål ang. mouseoverefekten !

Jeg har prøvet at illustrere hvad jeg vil nederst på siden. Jeg vil gerne lave det sådan, at når man peger på eks. Objekt 1, så kommer der en beskrivelse af objektet ude hvor x\'erne er på samme side. Altså uden at der bliver skiftet side.

Objekt 1                          xxxxxxxxx
Objekt 2                          xxxxxxxxx
Objekt 3                          xxxxxxxxx
                                  xxxxxxxxx
                                  xxxxxxxxx
                                  xxxxxxxxx


Jeg har prøvet at gøre det inde i paint shop pro, men det er ikke lykkedes. Så jeg er klar over, at jeg nok har brug for et java-script. Er der nogen som kan hjælpe med en løsning, eller evt. et sted hvor jeg kan hente et sådant java-script ?
Avatar billede poull Nybegynder
29. juli 2001 - 21:34 #1
Skal det stå i en anden frame eller celle eller hvordan
Avatar billede poull Nybegynder
29. juli 2001 - 21:37 #2
Men det er vel noget med at lave det sådan
<DIV id=\"beskrivelse\"> Her kommer beskrivelsen til at stå </DIV>

og så ved objektet(går ud fra det kunne være et billed)
<IMG onMouseOver=\"document.getElementById(\'beskrivelse\').innerHTML=\'Beskrivelsen for dette billed\'\">
Avatar billede engrob Nybegynder
29. juli 2001 - 21:38 #3
Du kunne prøve med et script, der skriver noget i et lag:

I head:
<script type=\"text/javascript\" language=\"javascript\">
ns4 = (document.layers) ? true : false;
ie4 = (document.all) ? true : false;
dom = (document.getElementById) ? true : false;

function skriv(tekst,lag) {
    if (ns4) {
        document.layers[lag].document.open();
        document.layers[lag].document.write(tekst);
        document.layers[lag].document.close();
    }
    else if (ie4) document.all[lag].innerHTML = tekst;
    else if (dom) document.getElementById(lag).innerHTML = tekst;
}
</script>

--------------------------


Body:

<div id=\"lag1\" style=\"position:absolute; top:100; left:200;\"></div>
<div id=\"lag2\" style=\"position:absolute; top:130; left:200;\"></div>
<div id=\"lag2\" style=\"position:absolute; top:160; left:200;\"></div>

<a href=\"#\" onmouseover=\"skriv(\'tekst1\',\'lag1\')\" onmouseout=\"skriv(\'\',\'lag1\')\">Objekt1</a>
<a href=\"#\" onmouseover=\"skriv(\'tekst2\',\'lag2\')\" onmouseout=\"skriv(\'\',\'lag1\')\">Objekt2</a>
<a href=\"#\" onmouseover=\"skriv(\'tekst3\',\'lag3\')\" onmouseout=\"skriv(\'\',\'lag1\')\">Objekt2</a>
Avatar billede engrob Nybegynder
29. juli 2001 - 21:39 #4
Det sidste lag skulle selvfølgelig hedde lag3 og ved onmouseout skulle det også være lag1, lag2 og lag3
Avatar billede smask Nybegynder
29. juli 2001 - 21:39 #5
Ja, det skal poppe frem i en celle ud til højre på siden
Avatar billede jakoba Nybegynder
29. juli 2001 - 21:43 #6
prøv Overlib, der er et lille script der laver den slags \'popop tekster\':
http://www.bosrup.com/web/overlib/

mvh JakobA
Avatar billede poull Nybegynder
29. juli 2001 - 21:46 #7
Så indsætter du bare DIV\'et i din celle
(skal hver beskrivelse stå på et nyt sted ude til højre eller skal du komme frem det samme sted)
Avatar billede smask Nybegynder
29. juli 2001 - 21:47 #8
jakoba> hvilken overskrift ligger det under ?

engrob> jeg forstår ikke helt dine koder ? Kan jeg bare kopiere din kode, og så rette den til med mine objekter m.m. ?
Avatar billede smask Nybegynder
29. juli 2001 - 21:50 #9
poull> ja, alle beskrivelserne skal komme komme det samme sted !

Hvad mener du med DIV\'et ?
Jeg er altså ikke så skrap til det her Java.
Avatar billede poull Nybegynder
29. juli 2001 - 21:51 #10
<DIV id=\"beskrivelse\"> </DIV>
Skal stå i cellen
Avatar billede engrob Nybegynder
29. juli 2001 - 21:54 #11
Det jeg har skrevet der skal stå i head placerer du mellem <head> og </head> og det jeg har skrevet skal stå i body paster du ind mellem <body> og </body>

Prøv at lave en testside. Så kan du nok godt se hvad der sker...
Avatar billede poull Nybegynder
29. juli 2001 - 21:56 #12
engrob>> lige en ting, beskrivelsen skulle fremkomme i den samme div så du skal ikke have tre og da de skal ligge i en celle skal de jo nok ikke have position:absolute.
Avatar billede hundevennen Nybegynder
29. juli 2001 - 22:00 #13
hvis du bruger dreamweaver kan du f.eks bruge show/hide layer, smmen med action onmouseover og onmauseout
Avatar billede poull Nybegynder
29. juli 2001 - 22:01 #14
Det kan virke uoverskueligt, men det er som sagt bare at have <DIV id=\"beskrivelse\"> </DIV> hvor beskrivelsen skal være.

Og så eventuelt kan du lave den funktion som engrob har for at sikre browser-kompatibilitet.
Avatar billede smask Nybegynder
29. juli 2001 - 22:01 #15
poull> jeg forstår altså ikke helt hvad du mener !
skal jeg skrive <DIV id=\"(beskrive af objektet)\"> </DIV> i den celle hvor beskrivelsen skal fremkomme ?
Avatar billede smask Nybegynder
29. juli 2001 - 22:06 #16
hundevennen> jeg laver siden i frontpage, men jeg ved ikke om det kan lade sig gøre der !!!
Jeg har lavet mine andre mouseovereffekter til linkknapper m.m. i PSP7, hvor der er en roolover funktion, men jeg ved ikke om det kan lade sig gøre at lave det der i!!!
Avatar billede poull Nybegynder
29. juli 2001 - 22:06 #17
nej okey, du har din tabel:
<TABLE>
  <TR>
    <TD>
      <IMG src=\"billed.gif\" onMouseOver=\"document.getElementById(\'beskrivelse\').innerHTML=\'Dette er den tekst du skal ændre og som kommer til at udgøre beskrivelsen\'\">
    </TD>
    <TD>
      <DIV id=\"beskrivelse\"> </DIV>
    </TD>
Avatar billede engrob Nybegynder
29. juli 2001 - 22:08 #18
Nå, okay, jeg havde lige forstået det anderledes men, hvis man placere diven i en celle virker det alligevel ikke i NS4
Avatar billede poull Nybegynder
29. juli 2001 - 22:08 #19
du kan så arbejde videre med det som engrob gør, nemlig at kalde en funktion under billedet/linket og sikre at det virker til flere browsere.
Avatar billede poull Nybegynder
29. juli 2001 - 22:09 #20
Kan godt \"brygge\" en helt lille fil hvis du ønsker.
Avatar billede engrob Nybegynder
29. juli 2001 - 22:10 #21
Du kan selvfølgelig også bare gøre det med billeder hvis du vil det. Det vil også sikre browserkompatiliteten.
Se her: http://www.webcafe.dk/diverse/artikler/101/da101.php3
Avatar billede poull Nybegynder
29. juli 2001 - 22:11 #22
engrob>> er det fordi det er en div eller hvorfor. Skal man så bruger <SPAN> eller gør det ikke nogen forskel
Avatar billede engrob Nybegynder
29. juli 2001 - 22:12 #23
Hvis du ikke positionerer diven absolut i netscape 4 så opfatter browseren den ikke som et lag
Avatar billede smask Nybegynder
29. juli 2001 - 22:14 #24
poull> det ville jeg gerne, da jeg ikke helt forstår hvordan det skal gøres ! hvor mange points skal du have ?
Avatar billede poull Nybegynder
29. juli 2001 - 22:19 #25
engrob>> jeg kender ikke så meget til NS så tak

smask>> tja du behøver da ikke spytte flere point i det, men det kommer jo nok ikke til at blive browser-kompatibilitet, så sig lige om det er i orden.
Det kommer til at blive en lille selvstændig fil
Avatar billede smask Nybegynder
29. juli 2001 - 22:23 #26
Det er i orden !!!
hvor lang tid skal du bruge ?
Avatar billede engrob Nybegynder
29. juli 2001 - 22:23 #27
Det var da så lidt.
Avatar billede engrob Nybegynder
29. juli 2001 - 22:24 #28
Det var til poull
Avatar billede poull Nybegynder
29. juli 2001 - 22:31 #29
Her er det:

<HTML>
<HEAD>
    <SCRIPT>
        function visbeskrivelse(tekst) {
            document.getElementById(\"beskrivelse\").innerHTML = tekst;
        }
    </SCRIPT>
</HEAD>

<BODY>
<TABLE border=\"1\" width=\"100%\">
    <TR>
        <TD width=\"80%\">
            Her skal objekterne være:<BR><BR>
            <A onMouseOver=\"visbeskrivelse(\'Her er den tekst du skal ændre og det bliver beskrivelsen for linket\')\" onMouseOut=\"visbeskrivelse(\'\')\">Et link</A><BR>
            <IMG onMouseOver=\"visbeskrivelse(\'Her er den tekst du skal ændre og det bliver beskrivelsen for billedet\')\" onMouseOut=\"visbeskrivelse(\'\')\">
        </TD>
        <TD width=\"20%\">
            <DIV id=\"beskrivelse\"></DIV>
        </TD>
    </TR>
</TABLE>
</BODY>
</HTML>
Avatar billede poull Nybegynder
29. juli 2001 - 22:33 #30
put det ind i en selvstændig fil så skulle det virke (desværre kun i internet explorer)
Avatar billede smask Nybegynder
29. juli 2001 - 22:36 #31
ok, poull, jeg prøver !!!

Og mange tak for hjælpen til jer alle...
Avatar billede olebole Juniormester
29. juli 2001 - 22:58 #32
<ole>
Hvis det bare skal virke i IE og NS6, er der ingen grund til at skrive:
<TD width=\"20%\">
    <DIV id=\"beskrivelse\"></DIV>
</TD>
...du kan blot skrive:
<TD width=\"20%\" id=\"beskrivelse\"></TD>

Men hvis du ønsker en virkning à la <a href=\"#\" title=\"noget tekst\"> - og det også skal virke i NS4.x og IE4.x, kan du bruge denne:

<html>
<head>
<script language=\"javascript\">

/* ----- Variabler, der skal ændres start ----- */

var backCol = \"#ffff33\"; // Baggrundsfarve
var borderW = 2; // Rammebredde
var borderCol = \"#333366\"; // Rammefarve
var pad = 4; // Luft om tekst
var xOffset = 15; // x-position i forhold til cursor
var yOffset = 2;; // y-position i forhold til cursor

// Tekst-formatering sætter du i style-sheet\'et

/* ----- Variabler, der skal ændres slut ----- */

var ns4 = (document.layers) ? true : false;
var ie4 = (document.all) ? true : false;
var dom = (document.getElementById) ? true : false;
var tekstBox = new Object();
var mouseX, mouseY;
var tblStStr = \'<table width=\"1\" height=\"1\" border=\"0\" cellspacing=\"0\" cellpadding=\"\'+borderW+\'\" bgcolor=\"\'+borderCol+\'\"><tr><td>\\n\'
            + \'<table width=\"1\" height=\"1\" border=\"0\" cellspacing=\"0\" cellpadding=\"\'+pad+\'\" bgcolor=\"\'+backCol+\'\"><tr><td><span class=\"myTxt\">\\n\';
var tblEndStr = \'</span></td></tr></table></td></tr></table>\\n\';
function getMouse(e){
    mouseX = (ns4 || (dom && !ie4))? parseInt(e.pageX) : parseInt(event.clientX);
    mouseY = (ns4 || (dom && !ie4))? parseInt(e.pageY) : parseInt(event.clientY);
}

function skriv(tekst) {
    tekstBox.css.left = mouseX+xOffset;
    tekstBox.css.top = mouseY+yOffset;
    if (ns4) {
        tekstBox.document.open();
        tekstBox.document.write(tblStStr+tekst+tblEndStr);
        tekstBox.document.close();
    }
    else tekstBox.innerHTML = tblStStr+tekst+tblEndStr;
    tekstBox.css.visibility = (tekst==\"\")? \"hidden\" : \"visible\";
}

function init(obj) {
    tekstBox = (ns4)? document.layers[obj] : (ie4)? document.all[obj] : document.getElementById(obj);
    tekstBox.css = (ns4)? tekstBox : tekstBox.style;
    if (ns4) {
        document.captureEvents(Event.MOUSEMOVE);
    }
    document.onmousemove = getMouse;
}

</script>

<style type=\"text/css\">
.myTxt {
    font-family:    Verdana;
    font-size:        10px;
    font-weight:    bold;
    color:            #ff0000;
}
</style>
</head>

<body onload=\"init(\'tekstDiv\');\">

<div id=\"tekstDiv\" style=\"position:absolute;visibility:hidden;\"></div>

<a href=\"#\" onmouseover=\"skriv(\'tekst1\')\" onmouseout=\"skriv(\'\')\">Link1</a><br>
<a href=\"#\" onmouseover=\"skriv(\'tekst2\')\" onmouseout=\"skriv(\'\')\">Link2</a><br><br>
<a href=\"#\" onmouseover=\"skriv(\'tekst3\')\" onmouseout=\"skriv(\'\')\">Link3</a>

</body>
</html>

/mvh
</bole>
Avatar billede poull Nybegynder
29. juli 2001 - 23:24 #33
Jeg gjorde det bare således at han nemt kunne ligge div\'en et andet sted.

(Er der noget ved at der dur i NS når han bruger frontpage til noget siden?)
Avatar billede olebole Juniormester
29. juli 2001 - 23:27 #34
Er der noget ved noget, lavet i FrontPage...?  :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester