Hej! Jag har ett par bilder jag skulle vilja ha lite information om när jag drar musen över dessa. Jag vet att man ska kunna köra något så text på samma ställe byts ut när man drar musen över något. Vad är det man använder och hur skriver man? Har för mig att det är något med innerhtml men jag kan va helt ute o cykla :)
Byta text när man drar över bild
9 svar · 248 visningar · startad av Type
Jag kom på att jag löser det på ett annat sätt. Genom att lägga in osynliga lager som ska visas när man drar över musen för jag vill lägga in hela texter och det blir svårt med innerhtml... kan dock rekomendera denna tråd:
http://www.webforum.nu/showthread.php?s=&postid=606161#post606161
okidoki.. gut! :)
Hur är det man gör det förresten? får det inte o funka...
Lite kod:
<div class="medlem" name="divPatrik" style="display:hidden;top: 100; left: 100;">
<h1>Patrik</h1>
</div>
Sen tänkte jag använda funktionen:
function showDiv(di) {
document.all.di.style.display = 'inline';
}
som anropas via:
... onmouseover="showDiv('divPatrik');" ...
Tyvärr funkar inte detta.. vad är det för fel?
det går inte.. identifierare förväntas står det.. sen funkar det inte när man drar över heller...
Ingen som vet varför det blir fel?
Jag skickar hela koden så kanske det blir lättare att se vad som är fel... Jag tror nämligen inte det är ett fel i funktionerna utan någon annan stans....
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sv" lang="sv">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Description" content="Välkommen in till det sköna bandet straxunder! Vi är det band i Nacka som spelar bäst! :)" />
<meta name="Author" content="Erik Sigvardsson" />
<meta name="KeyWords" content="straxunder, band, nacka, musik" />
<title>straxunder</title>
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript">
function showDiv(di) {
document.all.' + di + '.style.display = 'inline';
}
function hideDiv(di) {
document.all.' + di + '.style.display = 'none';
}
</script>
<style type="text/css">
#divImg {
width:110px;
background-color:#F1F3F2;
margin:80px 0px 0px 0px;
padding:10px;
border:1px solid #000000;
}
.medlem {
background-color:#F1F3F2;
margin:0px;
width:200px;
float:right;
padding:10px;
border:1px solid #000000;
}
</style>
</head>
<body>
<div id='head'>
<a href="index2.php"><img src="bilder/head_medlemmar.gif" style="border:0" alt="HEM" /></a>
</div>
<? include("menu.inc");?>
<div id="outer">
<h1>UNDER CONSTRUCTION...</h1>
<div class="floatRight">
<div class="divRight">
<h1>OM BAND.</h1>
Vi är ett Nackaband med rötter från Vikingshill till Nyköping. Vi har ett rockigt popsound och skön attityd.
<div class="Corner" style="bottom: -2px;"> </div>
</div>
</div>
<div class="medlem" id="divPatrik" style="display:none;top: 100; left: 100;">
<h1>Patrik</h1>
</div>
<div class="medlem" id="divOlof" style="display:none;top: 100; left: 100;">
<h1>Olof</h1>
</div>
<div class="medlem" id="divOlle" style="display:none;top: 100; left: 100;">
<h1>Olle</h1>
</div>
<div class="medlem" id="divNisse" style="display:none;top: 100; left: 100;">
<h1>Nisse</h1>
</div>
<div class="medlem" id="divFredrik" style="display:none;top: 100; left: 100;">
<h1>Fredrik</h1>
</div>
<div id="divImg">
<img src="bilder/patrik.jpg" style="border:0" alt="PATRIK" onmouseover="showDiv('divPatrik');" onmouseout="hideDiv('divPatrik');" /><br /><br />
<img src="bilder/olof.jpg" style="border:0" alt="OLOF" onmouseover="showDiv('divOlof');" onmouseout="hideDiv('divOlof');" /><br /><br />
<img src="bilder/bildkommersenare.jpg" style="border:0" alt="OLLE" onmouseover="showDiv('divOlle');" onmouseout="hideDiv('divOlle');" /><br /><br />
<img src="bilder/nils.jpg" style="border:0" alt="NISSE" onmouseover="showDiv('divNisse');" onmouseout="hideDiv('divNisse');" /><br /><br />
<img src="bilder/fredrik.jpg" style="border:0" alt="FREDRIK" onmouseover="showDiv('divFredrik');" onmouseout="hideDiv('divFredrik');" /><br /><br />
</div>
</div>
</body>
</html>
<script type="text/javascript">
function showDiv(di) {
document.getElementById(di).style.display = 'block';
}
function hideDiv(di) {
document.getElementById(di).style.display = 'none';
}
</script>
dectgap: Du är kung. Tack :) :birp