Erledigt: Hover für Divs?

Webentwicklung XHTML / CSS
 
Editiert: 17.10.07, 01:47 Uhr
Schönen juten Abend oder auch Morgen...

Gibt es eine vernünftige (muss wenn möglich auch im bösen IE funktionieren) Lösung für folgendes Problem (?):

Ich habe ein Div welches x Pixel hoch ist. Nehmen wir als Beispiel 5 Pixel und eine Breite von 600 Pixel. Dieses Div ist mit grauer Farbe gefüllt. Es ist ausserdem kein Inhalt zu sehen.

Wenn ich nun mit der Maus über dieses Div fahre (notfalls auch per Klick) soll sich das Div in der Höhe vergrössern auf beispielsweise 40 Pixel und der Inhalt sollte sichtbar werden.

Ich bin ziemlich überzeugt, dass dies per CSS möglich sein sollte allerdings blick ich irgendwie langsam nicht mehr durch. Ich hab mich schon schlau gemacht per Tante Google hab aber nur Varianten gefunden die im IE 6 nicht funktionieren?! rafftnix

Hab mich dann erinnert dies kürzlich irgendwo gesehen zu haben. Genauer gesagt war das bei den Popnutten. Nur wird mir bei dem Code da noch wirrer im Kopf (die haben da ja noch den Hover oben sowie unten) ja

Gibt es jemanden der mir bei diesem Problem helfen kann und dieses einigermassen verständlich erklären kann....? verlegen


Gruss,
Coq
Link zu diesem Beitrag in die Zwischenablage kopieren
Mister Ad
Werbung
Schon mal bei Saturn, DaWanda oder notebooksbilliger.de geguckt? Vielleicht wirst du dort fuendig.

 
Editiert: 06.04.09, 12:31 Uhr
Dieser Beitrag wurde vom Mitglied gelöscht.
Link zu diesem Beitrag in die Zwischenablage kopieren
Das heisst soviel wie ohne JS werd ichs nicht so hinbringen, dass es auderdem auch zu allen Browsertypen kompatibel ist? pee
Link zu diesem Beitrag in die Zwischenablage kopieren
genau. ohne js ist das aber eh nicht zu machen.

am einfachsten geht's mit einem javascript framework. ich benutze auch am liebsten moootools, ansonsten kannst du sowas auch mit script.aculo.us () oder jquery () bewerkstelligen. die sind alle schnell gelernt.
Link zu diesem Beitrag in die Zwischenablage kopieren
Nein das mti den Mootools ist schwer in Ordnung. Wollte nur wissen ob es irgendwie auch ohne machbar ist. Aber in dem Fall werde ich dies so lösen. Danke euch für den guten rat um die späte Uhrzeit )
Link zu diesem Beitrag in die Zwischenablage kopieren
effektiv ist das ja nix anderes als ein menü. auf cssplay gibt es jede menge drop down menüs, die rein per css hovern - auch im IE - man muss da ein bissl mit tabellen rumtricksen aber funktionieren tut es.
http://www.cssplay.co.uk/menus/dd_valid.html
Link zu diesem Beitrag in die Zwischenablage kopieren
Jein. Es geht im eigentlichen Sinne darum, dass ich für meinen Fotterbereich eine relativ dunkle Farbe gewählt habe. Die passt zwar zum Rest lässt den Footer aber ziemlich herausstechen weil abgesehen vom Menü im Headerbereich alles eher hell gehalten ist. Nun will ich den Footer verstecken und nur wenn man explizit danach sucht diesen aktivieren lassen )
Link zu diesem Beitrag in die Zwischenablage kopieren
Irrelevanter Beitrag (anzeigen):

Link zu diesem Beitrag in die Zwischenablage kopieren
Irrelevanter Beitrag (anzeigen):

Link zu diesem Beitrag in die Zwischenablage kopieren
Ich hoffe ich darf den Thread noch ein bisschen weiter benützen )

Der Fx.Slide von den Mootools funktioniert super. Der fährt rein und raus und ist zu Beginn auch hidden. Allerdings habe ich ein kleines Problem. Da ich den Slide ja im Footer verwende funktioniert das ausfahren zwar aber er scrollt das Browserfenster nicht automatisch mit was sehr wenig Sinn macht. Ich habe es mit der „scrollTo“-Funktion versucht. Wenn ich da die Parameter 0,0 verwende dann funktioniert es, das heisst er Scrollt an den Anfang der Seite. Wenn ich nun aber andere Parameter verwende (um ans Ende der Seite zu scrollen) wie z.B. die Variabel „win-Height“ die man ja auslesen kann dann funktioniert das ganze nicht mehr.

Wo liegt mein Denkfehler? (


Edith meint:

Mein JS sieht so aus momentan (ohne das Scrolling):

  1. window.addEvent('domready', function(){
  2. var mySlide = new Fx.Slide('fuss');
  3. $('toggle').addEvent('click', function(e){
  4. e = new Event(e);
  5. mySlide.toggle();
  6. e.stop();
  7. });
  8. mySlide.hide();
  9. });
Quelltext in Zwischenablage kopieren
Link zu diesem Beitrag in die Zwischenablage kopieren
Win-Height gibt ja nur die Größe deines Browserfensters aus, nicht die Höhe der HTML-Seite. Und wenn du dem Footer ne ID gibst und die als Referenz nutzt?
Link zu diesem Beitrag in die Zwischenablage kopieren
#