Bilder heller machen. Wie ?

G

Guevara

Mitglied
Hallo alle zusammen,


Liebe Jungs,

Auf meiner Seite habe ich 110 Bilder, das ist für eine private Musicseite. Die Bilder sind von den Sängern. Ich möchte so machen: wenn ich mit der Maus über einem Bild geht, indem Das Bild ein "Link" ist, dass das Bild bischen heller wird oder vielleicht eingerahmt. WENN ES MÖGLICH IST.


Beispiel: http://www.xpression-music.de/ und http://www.pattys-page.de/


Ich bin für jede Hilfe sehr dankbar.

schöne Gruss Guevara.

 
Ahoi Guevara,

möglich ist es auf jeden Fall. Die Frage ist, ob man die recht aufwendige
oder die (mehr oder weniger) elegantere Lösung nimmt.

Die elegantere Lösung wäre ein programmierter Code, der auf die Bilder
zugreift und sie in der Helligkeit ändert, quasi so wie die entsprechenden
Schieberegler in diversen Grafikprogrammen.
Programmieren dieser Form ist aber ganz und gar nicht mein Gebiet. :-(

Die aufwendige Lösung wäre, daß Du in einem Grafikprogramm (z.B. Photoshop)
die Helligkeitswerte des Bildes änderst und das Bild dann abspeicherst.
Somit würde sich die Anzahl Deiner Bilder allerdings verdoppeln.
Weil Du pro Bild eine dunkle und eine helle Version brauchst.

Das was jetzt noch nicht geklärt ist, ist die Art des "Bildertausches". Hier wäre
JavaScript eine Möglichkeit. Dort ist es ohne größeren Aufwand möglich per
MouseOver ein Bild gegen ein anderes durchzutauschen.

Vielleicht ist dies ein erster Ansatz...

Tschööö
Souli
 
CODE <script type="text/javascript">
<!--
jollyFadeObjects = new Object();
jollyFadeTimers = new Object();

function jollyFade(object, destOp, rate, delta){
if (!document.all)
return
if (object != "[object]"){
setTimeout("jollyFade("+object+","+destOp+","+rate+","+delta+")",0);
return;
}
clearTimeout(jollyFadeTimers[object.sourceIndex]);

diff = destOp-object.filters.alpha.opacity;
direction = 1;
if (object.filters.alpha.opacity > destOp){
direction = -1;
}
delta=Math.min(direction*diff,delta);
object.filters.alpha.opacity+=direction*delta;

if (object.filters.alpha.opacity != destOp){
jollyFadeObjects[object.sourceIndex]=object;
jollyFadeTimers[object.sourceIndex]=setTimeout("jollyFade(
jollyFadeObjects["+object.sourceIndex+"],"
+destOp+","+rate+","+delta+")",rate);
}
}
//-->
</script>

</head>
<body scroll=no>

<div class="titel">
<a href="http://www.javatop.de" target="_top"><img src="../frames/top.gif" class="logo" alt="www.javatop.de" align=absmiddle></a>
JollyFade
<tt class="autor">
by:
<a href="mailto:jolly-p@aol.com">
Jolly-P
</a>
<b title="Browser-Test">[IE]</b></tt>
</div>

<p align=center><big><b>M</b></big>ouseover-Filtereffekt für Bilder.</p>

<div align="center"><a href="../frames/demolink.htm" target="links"><img onmouseover=jollyFade(this,100,10,10)
style="FILTER: alpha(opacity=30)"
onmouseout=jollyFade(this,30,10,10) src="../frames/pix1.gif" border=0></a></div>
<br>
<div align="center"><a href="../frames/demolink.htm" target="links"><img onmouseover=jollyFade(this,100,10,10)
style="FILTER: alpha(opacity=30)"
onmouseout=jollyFade(this,30,10,10) src="../frames/pix2.gif" border=0></a></div>
<br>
<div align="center"><a href="../frames/demolink.htm" target="links"><img onmouseover=jollyFade(this,100,10,10)
style="FILTER: alpha(opacity=30)"
onmouseout=jollyFade(this,30,10,10) src="../frames/pix3.gif" border=0></a></div>
<br>
<div align="center"><a href="../frames/demolink.htm" target="links"><img onmouseover=jollyFade(this,100,10,10)
style="FILTER: alpha(opacity=30)"
onmouseout=jollyFade(this,30,10,10) src="../frames/pix4.gif" border=0></a></div>

<p align=center>» Link zu <a href="jollyfade2.htm" target="links">JollyFade (2)</a></p>
So das dürfte helfen!
 
Hallo,

Ich danke euch beiden, Problem gelöst.
wink.gif
 
Sie müssen sich einloggen oder registrieren, um hier antworten zu können.
Zurück
Oben