nicht angemeldet
Hi,
Alle Versuche, die Position (oder Größe) zu ändern, wirkten sich auf alle beteiligten Bilder aus. Für mich ist es jedoch wichtig, nur auf 'test1' einzuwirken.
In deinem Code ist weder ein Bild zu sehen, dass über einen solchen Bezeichner irgendwie identifizierbar wäre, noch was du versucht hast.
Bitte lese nach, wie man Probleme nachvollziehbar beschreibt.
MfG ChrisB
Hallo ChrisB,
sorry, wenn ich mich unverständlich bzw. unvollständig ausgedrückt habe. Wollte mich nur kurz und prägnant ausdrücken, was wohl nicht geklappt hat.
Ich versuchs noch mal:
Mit meinem beschriebenen Code
<img class="cam1" onmouseover="(src='bilder/test1.gif')" onmouseout="(src='bilder/test2.jpg')" src="bilder/test2.jpg" alt="Freihantelbereich"></img>
habe ich das Ergebnis, dass das Bild 'test2.jpg' bei onmouseover in das Bild 'test1.gif' überführt wird und bei onmouseout wieder zurück zu Bild 'test2.jpg'. Soweit ist ja alles prima.
Jetzt möchte ich erreichen(ohne irgendwas bei Bild 'test2.jpg' zu verändern), dass das bei onmouseover erscheinende Bild 'test1.gif' eine festgelegte Position im Browser einnimmt.
Bislang wird es nach unten links dargestellt, was dazu führt, dass es nur teilweise sichtbar ist und gescrollt werden muss, um es vollständig zu sehen. Ich hätte es gern zentral.
Hier der komplette Code:
<!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" xml:lang="de" lang="de">
<head>
<title>test</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<meta name="description" content="" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="generator" content="Webocton - Scriptly (www.scriptly.de)" />
<link href="css/camsight.css" type="text/css" rel="stylesheet" />
<style type="text/css">
<!--
#kopfbereich {
background:url(../bilder/head.jpg) no-repeat;
height:116px;
width:800px;
}
#steuerung {
background-color:#C8BCBA;
height:40px;
width:800px;
word-spacing:2.0em;
padding-left:5em;
padding-top:0.7em;
}
#inhalt {
background:url(../bilder/body2_cam.jpg) no-repeat;
height:475px;
width:800px;
font-size:20px;
padding-left:2em;
}
* {
margin:0;
padding:0;
}
.cam1{
border:1px solid #99ccff;
margin:300px 0px 0px 200px;
}
-->
</style>
</head>
<body>
<div id="kopfbereich">
</div>
<div id="steuerung">
<a href="index.html" ><font color="#484340">STARTSEITE</a>
</div>
<div id="inhalt">
<p> <img class="cam1" onmouseover="(src='bilder/test1.gif')" onmouseout="(src='bilder/test2.jpg')" src="bilder/test2.jpg" alt="Kardiiobereich"></img></p>
</div>
</body>
</html>
Anzumerken ist vielleicht noch, dass test2.jpg ein Kamerasymbol ist, test1.gif ein Foto mit entsprechend größeren Ausamßen. Daher das Problem.