Bild das immer an selber Position mitscrollt

[Sandro Feuillet]

Hallo Zusammen,

Ich suche eine Lösung für ein Bild, welches stets an der selben stelle stehen bleibt, egal ob man scrollt auf einer Seite.
Das Layout ist zentriert und das Bild sollte etwas über den linken Rand hinausragen und egal bei welchem Bildschirm stets an der selben Position stehen, kennt da jemand ein Script welches das kann?

Liebe Grüsse,
Sandro

 

[martin_zh]

Bestimmt nicht die schönste - aber die einfachste ist wohl mit jQuery

CODE $(window).scroll(function() {
$('.fixedBox').css('top', ($(this).scrollTop()) + "px");
});

 

[Jürgen Auer]

Öhm - einfaches CSS tuts auch:

CODE background-image:url(); background-repeat: no-repeat; background-attachment : fixed;



Die Position kann man ja noch zusätzlich definieren.

 

[Peter Schneider]

Bei doctype "strict" funktioniert "position: fixed" für div-Boxen im aktuellen IE, Firefox und Opera (mehr kann ich nicht überprüfen). Ohne Doctype weigert sich IE.

Du hättest dann aber die Möglichkeit, mit Hilfe von Conditional Comments die älteren IE abzufangen und mit einem Ersatz-CSS oder irgendwelchem JS zu beglücken:
http://msdn.microsoft.com/en-us/library/ms...28VS.85%29.aspx

Wobei, wenn Jürgens Lösung mit Hintergrundsbild überall funktioniert und im Prinzip das der Sinn ist ("im Hintergrund&quot, geht das ja auch...

 

[Sandro Feuillet]

Danke für eure Hinweise,

Wir haben das jetzt mit CSS hingekriegt, auf folgende Weise:

CODE
#f1 { position:fixed; top:400px; left:0px; width:100%; height:310px;}
#float_logo_wrapper {width:1050px; height:310px;margin: 0 auto;}
#float_logo {
width:310px;
height:300px;
background-image:url('float_logo');
background-repeat:no-repeat;
}




Das Logo ist jetzt immer am richtigen Ort im Layout und scrollt auch mit wie es soll.
Ein Problem ist jetzt, dass diese Divs den Content der Seite überlagern und Links darunter nicht mehr klickbar sind...
Mit z-index der verschiedenen Divs haben wir das bisher nicht hingekriegt, hat jemand eine Idee wie ich die dahinter liegenden Divs so hervorholen kann, dass die Links klickbar bleiben?

 

[Jürgen Auer]

QUOTE (Sandro Feuillet @ Do 3.06.2010, 10:44)Ein Problem ist jetzt, dass diese Divs den Content der Seite überlagern und Links darunter nicht mehr klickbar sind...
Mit z-index der verschiedenen Divs haben wir das bisher nicht hingekriegt, hat jemand eine Idee wie ich die dahinter liegenden Divs so hervorholen kann, dass die Links klickbar bleiben?

Wenn das mit z-index nicht klappt: Liegt womöglich dieses Bild-div selbst in diesem Vordergrund-div drin? Sprich - Änderung der Reihenfolge bzw. Verschachtelung im Html-Code?


Ansonsten: Die divs so klein wie das Bild machen. Der obige Wert > 1000 irritiert mich. Und width:100% scheint mir auch unnötig groß zu sein, so daß Content verdeckt / überdeckt wird.