nicht angemeldet
3 Sachen (dringend)
Hab 3 einzelne Fragen. Wenn ihr nur zu einer die Antwort wisst, dann is das auch OK...
1.: Mit dem CSS Sheet "filter:alpha(opacity=50%...usw" kann man ja ein Bild leicht durchsichtig machen.
Ich moechte nun ein Bild 50% durchsichtig haben und wenn man mit der Maus drüber fährt soll das Bild 100% sichtbar sein. (Also mit dem OnMouseOver Befehl)...
Wie kriege ich die beiden Befehle zusammengepackt??
2.: Ich habe auf meiner Seite oben eine kleine Leiste mit aneinander gereiten Buttons (img: http://www.annox.de/buttonleiste.jpg). Ich möchte nun, dass ein kleines JS Menu erscheint, wenn ich mit der Maus über den Button fahre. (ähnlich wie auf http://www.yeha.de, nur halt evtl mit einer kleinen Hintergrundgrafik).
Wie is das allgemein machbar,
und wie krieg ich dort die Hintergrundgrafik rein?
3.: Das is glaub ich das komplizierteste. :D
Das ganze ist ähnlich wie Punkt 2. Ich hab wieder einen Button (www.annox.de/votevorher.jpg). Und wenn ich nun den Button anklicke soll mit einer Animation der Kasten Vote herunterfahren runterfahren, wo dann halt eine über PHP Scripts geschaltete Umfrage mit Hintergrundbild drin erscheint. (www.annox.de/votenachher.jpg - Das ist allerdings nur ein KonzeptGFX...da soll evtl nochn kleine Imgae mit rein etc.).
Zudem soll der Kasten dann noch durch CSS Styles leicht durchsichtig gemacht werden können.
Ich habe mir sagen lassen, dass man das mit Javascripts geht, aber ich hab weder über Google noch hier irgendwo genauere Hinweise fürr eine solche Animation gefunden.
Ich freue mich auf kompetente Antworten. Mir währen Antworten mit Quellcode/Beispielseiten und kleinen Erläuterungen natürlich am liebsten.
Mit freundlichen Grüssen, Sting;
-
Guude!
Hab 3 einzelne Fragen. Wenn ihr nur zu einer die Antwort wisst, dann is das auch OK...
Danke ;)
1.: [...]
Ich moechte nun ein Bild 50% durchsichtig haben und wenn man mit der Maus drüber fährt soll das Bild 100% sichtbar sein. (Also mit dem OnMouseOver Befehl)...Das ist, soweit ich weiss, ein Microsoft-Filter, also mit anderen Browsern unbrauchbar. Tausche doch einfach zwei Bilder bei onMouseover: Ein durchsichtiges (GIF), und ein nicht-transparentes. Näheres bei den JS-Beispielen in SelfHTML ("Dynamische Grafikbuttons" o.ä.).
2.: [...]Ich möchte nun, dass ein kleines JS Menu erscheint, wenn ich mit der Maus über den Button fahre.
Such mal nach DHTML, Menüleisten, etc. im Archiv... da gibt's ne Menge zu dem Thema. Prinzipiell macht man sowas mit <div>s und deren visibility-Status, da passen dann auch Hintergrund-Grafiken rein.
LG
Lemmy--
Realität ist die Illusion, die durch ein zu geringes Maß an Alkohol entsteht...-
aloah ma wieda
1.: [...]
Ich moechte nun ein Bild 50% durchsichtig haben und wenn man mit der Maus drüber fährt soll das Bild 100% sichtbar sein. (Also mit dem OnMouseOver Befehl)...Das ist, soweit ich weiss, ein Microsoft-Filter, also mit anderen Browsern unbrauchbar. Tausche doch einfach zwei Bilder bei onMouseover: Ein durchsichtiges (GIF), und ein nicht-transparentes. Näheres bei den JS-Beispielen in SelfHTML ("Dynamische Grafikbuttons" o.ä.).
Bin ich mir net sicher, aba das währe nicht so schlimm, wenns auf NS dann net 100 Pro funzt. Wichtig is mir vor allem der Übergang. Daher funktioniert das mit den 2 Bildern auch nicht.
Ich möchte einfach nur wissen wie man in einem OnMouseover Befehl bei nem Img die Opacity verändertMfG
-
sersn!
also bei der 1. farge kann ich dir definitiv weiterhelfen!http://www.optik-pack.2in.de/privat/scripte
-->alpha fading
das dürfte genau das sein was du brauchst wenn ichd as richtig verstanden habe!
greetz
MakkuZ-
sersn!
also bei der 1. farge kann ich dir definitiv weiterhelfen!http://www.optik-pack.2in.de/privat/scripte
-->alpha fading
das dürfte genau das sein was du brauchst wenn ichd as richtig verstanden habe!
greetz
MakkuZHey danke...genausowas hab ich gesucht :)
Nu nur noch die andern 2 Punkte finden...*seufz*
-
-
-
-
hi
1.: Mit dem CSS Sheet "filter:alpha(opacity=50%...usw" kann man ja ein Bild leicht durchsichtig machen.
Ich moechte nun ein Bild 50% durchsichtig haben und wenn man mit der Maus drüber fährt soll das Bild 100% sichtbar sein. (Also mit dem OnMouseOver Befehl)...
Wie kriege ich die beiden Befehle zusammengepackt??onmouseover="if(navigator.userAgent.indexOf('MSIE"')!=-1){this.style.filter='Alpha(opacity=100%)';}"
onmouseout="if(navigator.userAgent.indexOf('MSIE"')!=-1){this.style.filter='Alpha(opacity=50%)';}"...und WEHE ich muss deswegen in anderen Browsern einen JS-Error sehen (wer beim UA lügt hat selber Schuld).
Kai Lahmann
-
Hallo Stingray,
Ich moechte nun ein Bild 50% durchsichtig haben und wenn man mit der Maus drüber fährt soll das Bild 100% sichtbar sein.
Warum mit JS das geht doch mit CSS alleine auch:
im style:
<style type="text/css">
a.trans:link{Filter:Alpha(opacity= 50); -moz-opacity: 50%;}
a.trans:visited{Filter:Alpha(opacity= 50); -moz-opacity: 50%;position:absolute}
a.trans:hover{Filter:Alpha(opacity= 100); -moz-opacity: 100%;}
</style>
mit der angabe -mozopacity... funktioniert der Transparenzeffekt auch in MOZILLAund im body dann:
<a href="#" class="trans"><img src="myimage.jpg"></a>2.Ich möchte nun, dass ein kleines JS Menu erscheint, wenn ich mit der Maus über den Button fahre. (ähnlich wie auf http://www.yeha.de, nur halt evtl mit einer kleinen Hintergrundgrafik).
Wie is das allgemein machbar,
und wie krieg ich dort die Hintergrundgrafik rein?also hier weiß ich jetzt auf die schnelle nur die tooltips per title attribut. Aber mit hintergrundgrafik? (muß das sein?) is schwierig. Vielleicht http://www.fractatulum.de/fraccss/sample/menu2format.htm
Ansonsten google halt mal nach javascript und download da gibt es viele Seiten mit scripten.3.: Das is glaub ich das komplizierteste. :D
Das ganze ist ähnlich wie Punkt 2. Ich hab wieder einen Button (www.annox.de/votevorher.jpg). Und wenn ich nun den Button anklicke soll mit einer Animation der Kasten Vote herunterfahren runterfahren,Naja das klingt nach DHTML:
Hier mal ein kleies Beispiel zum rumspielen:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>div von außerhalb des screen einfahren lassen</title><style type="text/css">
#bewegdiv{font:14px sans-serif;position:absolute;text-align:center;padding:15px;top:-60px;left:150px;border:4px outset red;width:200px;background-color:gold}
#frage{font:40px sans-serif;text-align:center;border:4px outset white;padding:10px;background-color:silver}
</style><script type="text/javascript">
var y=-60 // diese zahl muß mit der angabe {top:} im betreffenden stylesheet übereinstimmen gibt den abstand vom oberen screenrand an
var beginy=-60// diese zahl muß mit der angabe {top:} im betreffenden stylesheet übereinstimmen gibt den abstand vom oberen screenrand an
var speed=4 // bewegt bei jedem aufruf das div um die angegebene anzahl pixel
var endey=100 // ende der bewegung bei der angegebenen anzahl pixel
function bewegen(richtung)
{
if (richtung=='runter' && y<endey)
{y=y+speed;
document.getElementById('bewegdiv').style.top=y;
if (y<endey) {setTimeout ("bewegen('runter')",20)};
}
else
{
y=y-speed;
document.getElementById('bewegdiv').style.top=y;
if (y>beginy) {setTimeout ("bewegen('rauf')",20)};
}
}
</script></head>
<body>
<div id="frage" onClick="bewegen('runter')">click mich dann bewege ich das div nach unten </div>
<div id="frage" onClick="bewegen('rauf')">click mich dann bewege ich das div nach oben</div><div id="bewegdiv">dieses div bewegt sich</div>
</body>
</html>Vielleicht hilfts Dir ja
Grüße aus Nürnberg, HarryS