einfachste jquery zu haben div mit "position:fixed" auf der unteren rechten Ecke(immer.. wie auf nach unten scrollen)?

Hallo, ich bin relativ neu in jquery, aber ich mag es, mich gefragt, ob ich einen div positioniert in der unteren rechten Ecke von der Seite, so dass es position fixiert bleibt es auch, wenn wir nach unten scrollen die Seite. Danach habe ich übergeben zu müssen, einen link durch ein Bild in dem div auf einen bestimmten Anker in der Seite.
Es sollte kurze und einfache.

InformationsquelleAutor yb007 | 2011-03-18

  1. 10
    #divid{
    position: fixed;
    right: 0;
    bottom: 0;
}
    er will unten rechts, und nicht der z-index benötigt, um sicherzustellen, seine vor das scrolling-Ding wie moe darauf hingewiesen?
    Links:0 unten Links in der Ecke ^_^
    es geht darum, Problem im ie, so kann ich die div-float an der unteren rechten Ecke des Bildschirms
    ich denke Nein - float arbeitet in position relative.

    InformationsquelleAutor Santosh Linkha

  2. 6

    Wenn du okay bist, zu akzeptieren, dass position:fixed nicht unterstützt IE6 und IE7 hat einige Vorsichtsmaßnahmen, dann verwenden Sie nicht jQuery an alle:

    <style type="text/css">
    #myFixedDiv {
        position: fixed;
        bottom: 0;
        right: 0;
        ...
    }
</style>

<div id="myFixedDiv">
    <a href="#myTargetDiv"><img src="img.gif" /></a>
</div>

<div id="myTargetDiv">
    ...
</div>

    etc. Allerdings, wenn der IE6 ist ein Problem, oder wenn das nicht funktioniert, aus welchem Grund auch immer, Sie können nur binden Sie ein Ereignis, um das Fenster scroll Veranstaltung zu helfen:

    <script type="text/javascript">
    var $myFixedDiv = $('#myFixedDiv');
    var iFixedDivHeight = $myFixedDiv.outerHeight({ 'margin': true });

    $(window).bind('scroll', function(e) {
        var iWindowHeight = $(window).height();
        var iScrollPosition = $(window).scrollTop(); //or document.body.scrollTop
        $myFixedDiv.css({ 'top': iWindowHeight + iScrollPosition - iFixedDivHeight });
    });
</script>

    oder etwas zu diesem Effekt. HTH.

    InformationsquelleAutor mway

  3. 2

    Kein jQuery benötigt 

    <div id="fixed-element" style="position:fixed; bottom:5px; right: 5px; z-index: 999">
    <a href="#myAnchor"><img src="/src/to/image.jpg" /></a>
</div>

    Aber wenn es mir war, ich würde dies tun:

    (Vorausgesetzt, die Breite und Höhe des Bildes sind 30px, die Verwendung von inline-CSS, aber ich würde es in eine externe Datei)

    <a href="#myAnchor" id="fixed-element" style="display:block; position:fixed; bottom:5px; right: 5px; z-index: 999; width: 30px; height: 30px; background:url(/src/to/image.jpg) no-repeat 0 0 transparent; text-indent: -9999">Click me</a>

    InformationsquelleAutor moe

  4. 0

    Überprüfen Sie diese link: Das ist, wie kann man die Fußzeile immer sichtbar

    InformationsquelleAutor SharpCoder

Schreibe einen Kommentar