Bilder-vorschau?
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
bild
gleichen format
http
index
jemand
kleine vorschau
kleinen bilder
kleinen bildes
kleineres bild
komprimieren
ladezeit
maus
ordner
original bilder
sagen
sau
stellen
tag
vorliegen
vorschau
-
huhu.
kann mir tag/jemand">jemand sagen, was ich machen muss, damit ein kleies Vorschau-Bildchen erscheint, wenn man mit der maus ?ber den link des bildes geht? geht sowas ?berhaupt?
ich hab da n?mlich ziemlich viele Bilder auf meiner Homepage, und hab sie nun alle in einer tabelle aufgelistet. Nun w?re es cool, wenn man immer mal ne kleine Vorschau der Bildes bekommt, ?ber dessen link man gerade mit der maus geht. Ich wollte die Bilder nicht auf Homepage stellen, da sie sonst so sau lange braucht, um auszuladen, da die bilder ziemlich gro? sind. also hab ich da nur die links zu den bildern angegeben. und damit man nicht jedes bild ?ffnen muss, um zu gucken obs gut ist, w?re ne Vorschau des Bildes ganz praktisch. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Sicher geht das! Frag einfach mel bei den Programmierern von HTML/CSS, ich kann dir da auch nicht weiterhelfen, oder such bei google! Und eins hilft auch noch: Bilder komprimieren! ;)
-
--> verschoben nach javascript &HTML
btw:ich hatte da mal was gefunden, was dir evtl. helfen k?nnte, da musst du aber von jedem bild nochmal ne mittlere version erstellen.
http://jswelt.de/index.php?opencat=JavaScripts&artid=1006451387&PHPSESSID=6289f7dcec73c9dfaa6c4f426699ada3
is ganz einfach, du schreibst in den <head> das hier rein:
<script language="JavaScript" type="text/javascript">
<!--
function change(tausch_bild_name,neues_bild_name)
{
window.document[tausch_bild_name].src = "BILDERVERZEICHNISNAME/"+neues_bild_name+".gif";
}
//-->
</script>
da wo die vorschau hinsoll schreibst du das hin:
<img src="ANFANGSVORSCHAUBILD.gif" name="gr" border=0>
und der <img> tag des kleinen bildes, von dem ne vorschau gezeigt werden soll, m?sste dannh so aussehen:
<a href="LINKZUMGRO?ENBILD" onMouseOver="change('gr', VORSCHAUBILDOHNEDATEIENDUNG)"><img src="KLEINESBILD.gif" border=0></a>
es m?ssen halt alle bilder im gleichen Format vorliegen. in diesem fall .gif wenn du was andres hast musstes einfach im teil im <head> ?ndern -
und wenn ich das dann geschafft habe, werden die bilder dann auch kleiner angezeigt, oder in der originalgr??e? die solln ja etwas kleiner sein, so wie, als wenn man bei windows in einem ordner, in dem die bilder sind, ein bild markiert, dann wird ja auch eine kleine vorschau erstellt.
ich probiers einfach mal aus. -
die bilder werden in originalgr??e angezeigt. das script tauscht dann die bilder mit den gr??eren aus.
-
muss ich jetzt von jedem Bild ein kleineres Bild nochmal machen, und hochladen?
also ich will das genau so haben wie hier:
http://jswelt.de/index.php?opencat=JavaScripts&artid=1006451387&PHPSESSID=6289f7dcec73c9dfaa6c4f426699ada3
aber anstatt die kleinen bilder drum rum solln da ganz viele links zu den bildern sein.
wenn ich euch hier alle links zu den bildern reinposte, kann mir dann jemand hier hinschreiben, was ich schreiben muss? -
ja, du brauchst deine bilder in 3 gr??en:
1. ganz klein f?r die ?bersicht
2. mittelgro? f?r die vorschau
3. originalgr??e
au?er die vorschau soll die originalgr??e sein, dann brauchst eben nur zwei gr??en
ich kann dir von so einer vorschau aber nur abraten, verursacht mehr traffic, sprich l?ngere ladezeiten und es kann leicht passieren, das es nicht so funktioniert wie es gedacht war, da bei onmouseover die bilder erst geladen werden m?ssen und dann verz?gert angezeigt werden -
alsom eigentlich will ich ja nur die links zu den bildern da hin schreiben.
also immer:
bild1.jpg
bild2.jpg
usw.
und wenn man da mit der maus r?ber geht, soll am rand oder irgendwo eine vorschau erscheinen. also ohne kleinere bilder, sondern nur den link zum bild. dann muss ich ja nur die gro?en original bilder haben...... -
Folgende M?glichkeit besteht auch:
<script type="text/javascript">
<!--
function preview(img) {
document.getElementById('image').src = img;
}
//-->
</script>
<span onmouseover="preview('bild2.jpg');">Bild 2</span><br />
<span onmouseover="preview('bild3.jpg');">Bild 3</span><br />
<span onmouseover="preview('bild4.jpg');">Bild 4</span><br />
<p />
<img src="bild1.jpg" alt="Vorschau" id="image" /> -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
