Festen header in Jqtouch

Überprüfen Sie heraus dieses plugin für jQTouch - http://code.google.com/p/jqtscroll/

InformationsquelleAutor Wojciech Bednarski

Werfen Sie einen Blick auf diese Website:
http://demo.lvengine.net/mobileuplink

Beachten Sie, dass es verwendet ein extra div:

<div id="jqt">

Werfen Sie einen Blick auf die javascripts und das css von dieser Seite. Der Autor verändert die original-jqtouch-Skripts ein bisschen passen diese änderung.

Für eine "Feste" Fußzeile, z.B. tab-Leiste, fügen Sie einfach eine neben div auf der gleichen Ebene wie die div#jqt:

<div id="other">
    <div class="tabbar">
        <ul>
            <li class="two"><a href="first.html">first tab</a></li>
            <li class="two"><a href="two.html">second tab</a></li>
        </ul>
    </div>
</div>

Dann code oben im css für .tabbar. Nutze meinen als Beispiel:

 .tabbar 
{
    position: absolute;
    bottom:0px;
    width:100%;
    height:48px;
    border-top:1px solid #444;
    overflow:hidden;
    padding: 0;
    margin: 0;
    background-image:-webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #999), color-stop(0.02, #666), color-stop(1, #222));
}

.tabbar li
{
    float: left;
    margin: 0;
    padding: 0;
    border: 0;
    font-size: smaller;
    display: block;
    text-align: center;
    border-right:1px solid #333;
    border-left:1px solid #6a6a6a;
}

.tabbar li:first-child
{
    border-right:1px solid #333;
    border-left:0;
}

.tabbar li:last-child
{
    border-right:0;
    border-left:1px solid #6a6a6a;
}

.tabbar ul
{
    border: 0;
    margin: 0;
    list-style: none;
}

.tabbar a 
{
    padding: 0;
    margin: 0;
    display:block;
    text-decoration:none;
    font-size: 0.8em;
    color:#eee;
    line-height:1.6em;
}

.tabbar li.two      {width: 50%;}

InformationsquelleAutor William Niu

Als Thomas wies darauf hin, es gibt keine Unterstützung für diese in der aktuellen version des Mobile Safari läuft auf dem iPhone.

Wenn Sie jQTouch sowieso, werfen Sie einen Blick auf die "floaty" - Erweiterung, die gebündelt mit den neuesten downloads. Es fügt eine floating div, bewegt sich mit Ihren Blättern, wenn auch mit einiger Verzögerung. Das Verhalten ist sehr ähnlich wie die "Archiv" - bar in der mobilen GMail-Oberfläche.

Hier ist die Seite Erweiterungen auf jQTouch erwähnt floaty:
http://code.google.com/p/jqtouch/wiki/Extensions

Laden Sie einfach die neueste bündeln und alles ist da. Es ist keine perfekte Lösung, aber es ist besser als nichts.

InformationsquelleAutor Henrik Joreteg