| Autor |
Nachricht |
Amy666
Threadersteller
Dabei seit: 18.06.2008
Ort: -
Alter: 39
Geschlecht: 
|
Verfasst Mi 23.07.2008 11:00
Titel swap image ? erstellen |
  |
|
hallo, da mein posting von gestern mir leider nicht weiterhelfen konnte, heute nochmal...
ich sitze schon die ganze zeit wieder und tüftle aber es kommt nix brauchbares raus...
ganz simpel: links stehen verkleinerte bilder, welche bei mausklick auf der rechten seite in groß erscheinen sollen.
also immer das jeweils angeklickte bild in groß. dabei soll kein neues fenster oder sonstiges geöffnet werden.
bitte um hilfe für anfänger ist dringend und ich bin noch kein code spezialist.
vielen dank
|
|
| |
  |
 |
pixelpapst303
Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht: 
|
Verfasst Mi 23.07.2008 11:02
Titel
|
|
|
mach mal ne kleine zeichnung, was links heißt und was rechts heißt  (ernsthaft)
|
|
| |
 |
|
|
Anzeige
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Mi 23.07.2008 11:06
Titel
|
|
|
dein Javascript
| Code: |
<script language="JavaScript" type="text/javascript">
function findObj(theObj, theDoc)
{
var p, i, foundObj;
if(!theDoc) theDoc = document;
if( (p = theObj.indexOf("?")) > 0 && parent.frames.length)
{
theDoc = parent.frames[theObj.substring(p+1)].document;
theObj = theObj.substring(0,p);
}
if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj];
for (i=0; !foundObj && i < theDoc.forms.length; i++)
foundObj = theDoc.forms[i][theObj];
for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++)
foundObj = findObj(theObj,theDoc.layers[i].document);
if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj);
return foundObj;
}
function showHideLayers()
{
var i, visStr, obj, args = showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3)
{
if ((obj = findObj(args[i])) != null)
{
visStr = args[i+2];
if (obj.style)
{
obj = obj.style;
if(visStr == 'show') visStr = 'visible';
else if(visStr == 'hide') visStr = 'hidden';
}
obj.visibility = visStr;
}
}
}
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
// -->
</script>
|
deine kleinen Bilder verlinkst du wie folgt
| Code: |
<a href="#" onClick="showHideLayers('s1','','show','s2','','hide')"><img src="**-klein.jpg" border="0" /></a>
|
die großen können so aussehen
| Code: |
<img src="**-gross.jpg" id="s1" style="border:1px solid #000000;" alt="" />
<img src="**-gross.jpg" id="s2" style="border:1px solid #000000;" alt="" />
|
hoffe es ist alles klar jetzt
|
|
| |
|
|
pixelpapst303
Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht:
|
Verfasst Mi 23.07.2008 11:27
Titel
|
|
|
weiß nicht, was du genau vor hast, aber reicht dir nicht sowas: Beispiel
| Code: |
<!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">
<head>
<style type="text/css">
#LargeView {
display: none;
position: absolute;
left: 250px;
top: 0px;
}
</style>
<script language="javascript" type="text/javascript">
<!--
function showLarge(pix, pixTitle)
{
document.getElementById('LargeView').innerHTML = "<img src=\""+pix+"\" titel=\""+pixTitle+"\" />";
document.getElementById('LargeView').style.display = "block";
}
function hideLarge()
{
document.getElementById('LargeView').style.display = "none";
}
-->
</script>
</head>
<body>
<div class="bildKlein">
<a onmouseover="showLarge('bild01.jpg','meine grossansicht')" onmouseout="hideLarge()" titel="Bild 1"><img src="bild01_klein.jpg" titel="Bild 1" /></a>
</div>
<div id="LargeView"></div>
</body>
</html>
|
EDIT: sehe gerade, dass du es onclick haben willst, nicht onmouseover... aber das sollte je nu kein problem darstellen
Zuletzt bearbeitet von pixelpapst303 am Mi 23.07.2008 11:29, insgesamt 2-mal bearbeitet
|
|
| |
|
|
Amy666
Threadersteller
Dabei seit: 18.06.2008
Ort: -
Alter: 39
Geschlecht:
|
Verfasst Mi 23.07.2008 11:45
Titel ... |
|
|
ja genau so soll es sein, ganz simpel, nur eben mit klick, ich bekomms nur leider nicht hin... probier jetzt nochmal kurz und wenns dann nicht klappt poste ich mal den code...
vielen dank erstmal
|
|
| |
|
|
pixelpapst303
Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht:
|
Verfasst Mi 23.07.2008 11:48
Titel
|
|
|
|
wenn es so sein soll, nimm doch einfach meinen code, und setzt statt onmouseover onclick ein. ggf. lässt du noch das onmouseout weg und fertig is das swaperle
|
|
| |
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Mi 23.07.2008 11:51
Titel
|
|
|
es ist manchmal zu witzig.
hier werden 2 versch funktionierende lösungen vorgeschlagen und man will es immer noch vorgekaut bekommen haben.
wie wollt ihr etwas dazulernen wenn es an eigeninitiative mangelt?
|
|
| |
|
|
pixelpapst303
Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht:
|
Verfasst Mi 23.07.2008 11:53
Titel
|
|
|
|
qft!
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Advanced Image Swap
Swap Image / Bild per Button klicken zeigen...oder ähnliches
Image Map erstellen
suche ein fall out Image Menu, mit 3 image ebenen
input type=image + image map
image map
|
|
Willkommen auf dem Portal für Mediengestalter
