nicht angemeldet
Mehre Bilder ansprechen
hey,
ich komm einfach nicht drauf....
Ich möchte dieses Script:
http://javascript.about.com/library/blzoom.htm#
Was (1) Bild Zoom, so umbauen damit mehre Bilder gezoomt werden.
Da getElementbyID nur das erste Bild anspricht und die andern
ignoriert.
Hab ich versucht das ganze per for schleife zulösen...
aber wie ichs auch dreh und wende es will nicht!
Also problem ist wie spreche ich alle Bilder an!
Eigentliches ZIEL:
Eine Php Gallerie die aus verzeichniss X alle Bilder
einliest und diese ausgibt.
Das Funktioniert auch alles.
linK:http://www.pahe.de/includes/pahe/gallerie/php_gallerie_working.php
Jetzt hätte ich gern einen
Button der alle Thumbnails größer
und einen Button der alle Thumbnails kleiner zoomt!
<head>
<title> ++++++ IMG ZooM JS +++++</title>
<SCRIPT TYPE="text/javascript">
function findDOM(objectId)
{
if (document.getElementById) {
return (document.getElementById(objectId));}
if (document.all) {
return (document.all[objectId]);}
}
var a = "1";
function zoom(type,imgx,sz)
{
imgd = findDOM(imgx);
if (type=="+")
{
for (var a = "1";a <= "3";++a){
imgd.width += 2;(b + a).height += (2*sz);}
}
if (type=="-" && imgd.width > 20)
{
imgd.width -= 2;imgd.height -= (2*sz);
}
}
var i = "m"+a;
var b = "m"
</script>
</head>
<body>
<img id="m1" alt="" src="../bilder/Wasserlilien.jpg" width="66" height="92">
<img id="m2" alt="" src="../bilder/Wasserlilien.jpg" width="66" height="92">
<img id="m3" alt="" src="../bilder/Wasserlilien.jpg" width="66" height="92">
<a href="#" onclick="zoom('-',(i),92/66)">Smaller</a>
<a href="#" onclick="zoom('+',(i),92/66)">Bigger</a>
<SCRIPT TYPE="text/javascript">
document.write("Variable i:" + i);
</script>
</body>
=> V I E L E N dank im vorraus!!!
-
Hallo,
allPics = document.getElementsByTagName("img"); for (i=0;i<allPics.length;i++) { allPics[i].onclick = function () { alert("hallo"); alert(this.src); } }(ungetestet)
wäre vielleicht ein Ansatz?
Gruß
jobo
-
Hallo,
allPics = document.getElementsByTagName("img");
for (i=0;i<allPics.length;i++) {
allPics[i].onclick = function () {
alert("hallo");
alert(this.src);
}
}> (ungetestet) > > wäre vielleicht ein Ansatz? > > Gruß > > jobo Vorab: Also lösungs vorschlag eins funktioniert nicht.(code s.unten) Ja sowas sagt mir schon eher zu! Werde es mit "TagName" gleich mal ausprobieren! Kleine neben Frage, ich bin noch relativ frisch was das thema javascript betrifft und als ich php gelernt habe war die error funktion mein bester freund :)! Sowas in die richtung vermisse ich bei JavaScript vorallem hat auch noch fast alles die gleiche farbe. Da der js syntax highlighter selbst hier im forum mehr farbliche trennung hat, is wohl pspad bezüglich javascript schrott! Bin kein Fan vom dreamweaver. Vieleicht könnt ihr mir einen JsNoob sicheren Editor empfehlen? Danke für die eure mühe und zeit ;) Hab den code etwas übersichtlicher gestalltet und den ersten lösungs ansatz mit eingebaut, der >so< leider nicht funktioniert hat: <!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> ++++++ IMG ZooM JS +++++</title> <SCRIPT TYPE="text/javascript"> var anzahl = "3"; function findDOM(objectId) {if (document.getElementById) {return (document.getElementById(objectId));}if (document.all) {return (document.all[objectId]);}} function zoom(type,imgx,sz) { imgd = findDOM(imgx); for (var bildNR = 1;bildNR <= anzahl;++bildNR) { imgd = findDOM(imgx); if (type=="+") {imgd.width += 2;imgd.height += (2\*sz);} if (type=="-") {imgd.width -= 2;imgd.height -= (2\*sz);} } } </script> </head> <body> <img id="nr1" alt="" src="../bilder/Wasserlilien.jpg" width="66" height="92"> <img id="nr2" alt="" src="../bilder/Wasserlilien.jpg" width="66" height="92"> <img id="nr3" alt="" src="../bilder/Wasserlilien.jpg" width="66" height="92"> <a href="#" onclick="zoom('-',(bildNR),92/66)">Smaller</a> | <a href="#" onclick="zoom('+',(bildNR),92/66)">Bigger</a> <SCRIPT TYPE="text/javascript"> document.write("Variable bildNR:" + bildNR); document.write("Variable anzahl:" + anzahl); </script> </body> </html>-
Hallo,
editor: scite, javascript mit der developers toolbar im firefox testen. bei mir kommt oben rechts immer ein rotes ausrufezeichen, wenn was falsch ist, drauf klicken, dann bist du in der "javascript fehlerkonsole", vielleicht kommt die auch mit was anderem her, mit firebug oder so. es gibt auch einen debugger.
Gruß
jobo
-
Hallo,
[var anzahl = "3";
function findDOM(objectId) {if (document.getElementById) {return (document.getElementById(objectId));}if (document.all) {return (document.all[objectId]);}}
function zoom(type,imgx,sz)
{raus:
imgd = findDOM(imgx);
for (var bildNR = 1;bildNR <= anzahl;++bildNR)
{imgx = "nr" + bildNR;
// das ist doch die id, nach der du suchst.imgd = findDOM(imgx);
das ist doch sowieso käse, denn document.getElementById() können doch alle Browser.
if (type=="+") {imgd.width += 2;imgd.height += (2*sz);}
if (type=="-") {imgd.width -= 2;imgd.height -= (2*sz);}
}
}sollte mein aler-script funktionieren, passe es doch an. statt alert veränderst du dann einfach die width.
Gruß
jobo
-
OH MAN! was eine Geburt!!!
Also mein Problem war =>
function findDOM(objectId) { if (document.getElementById) { return (document.getElementById(objectId));} if (document.all) { return (document.all[objectId]);} }sowie
imgd = findDOM(imgx);
dieser R O T Z!!!!Nach dem ich hauptsachemaleingebautnurzumverwirrengut
durch document.getElementById
ersetzt hab, konnte ich das script besser verstehen....
5min später hats funktioniert!
Habs jetzt nicht mit alert gelöst.
Sondern auf der Basis des ersten posts.
War für mich einfacher.! !VIEL DANK! ! für eure Hilfe und eure Zeit!
Wünsche euch noch einen schönen abend!
-----------------------------
Das Funktionierende Script!!!
-----------------------------<html> <head><SCRIPT TYPE="text/javascript"> var anzahl = "3"; var nr = ""; function zoom(type,imgx,sz) { for (nr=1;nr <= anzahl;nr++) { imgd = document.getElementById("myimg" + nr); if (type=="+" && imgd.width < 175) {imgd.width += 2;imgd.height += (2*sz);} if (type=="-" && imgd.width > 20) { imgd.width -= 2;imgd.height -= (2*sz);} } } </script></head> <body> <img id="myimg1" alt="" src="../bilder/Wasserlilien.jpg" width="66" height="92"><br /> <img id="myimg2" alt="" src="../bilder/Wasserlilien.jpg" width="66" height="92"><br /> <a href="#" onclick="zoom('-','myimg'+(nr),92/66)">Smaller</a> | <a href="#" onclick="zoom('+','myimg'+(nr),92/66)">Bigger</a> </body> </html>
-
-
-
-
Guten Morgen,
versuche es mit einer größeren Schleife...function zoom(type,imgx,sz) { for (var a = 1;a <= 3;a++){ imgd = findDOM("m" + a); //oder b+a if (type=="+") { imgd.style.width += 2; imgd.style.height += (2*sz); } if (type=="-" && imgd.width > 20) { imgd.style.width -= 2; imgd.style.height -= (2*sz); } } }Oder so ähnlich, wobei ich nicht verstanden habe was es mit diesem sz auf sich hat (Seitenverhältnis?).
Meiner Erfahrung nach reicht es übrigens eine Richtung (height oder width) zu ändern, die andere passt sich idR an.Alles ungetestet.
--
sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(-
Hi,
for (var a = 1;a <= 3;a++){
eine Schleife ist ein ungeeignetes Instrument für Animationen.
Alles ungetestet.
Das glaube ich gerne.
Gruesse, Joachim
--
Am Ende wird alles gut.-
Hi,
for (var a = 1;a <= 3;a++){
eine Schleife ist ein ungeeignetes Instrument für Animationen.muss mich korrigieren da es in dieser Schleife nicht um eine Animation geht. Wer in Ruhe liest ist klar im Vorteil...
Gruesse, Joachim
--
Am Ende wird alles gut.-
for (var a = 1;a <= 3;a++){
eine Schleife ist ein ungeeignetes Instrument für Animationen.
muss mich korrigieren da es in dieser Schleife nicht um eine Animation geht.Du musst dich nicht korrigieren, vermutlich stimmt der Satz ja, er hat nur nichts mit der Sache zu tun ^^ (Ich habe noch nie was mit JS animiert, entweder ich nehme ein animiertes GIF oder die Animation ist ungewollt und resultiert aus nachladendem Inhalt).
--
sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(
-
-
-