Défilement de la div sur iPhone sans l'aide de 2 doigts?

J'ai une UIWebView incorporé dans mon iPhone, et j'aimerais garder un blocage de l'en-tête et pied de page de la DIV sur la page à tout moment, avec un défilement centre de DIV.

Je sais que je pourrais le faire à l'aide d'un en-tête/pied de page qui sont UIView contrôles, mais je veux l'en-tête et pied de page HTML vrd, comme un pur HTML/JS/CSS solution sera plus facile de port pour Android/PalmPre/AdobeAir, qui va être sur ma liste de choses à faire assez rapidement.

Je peux le faire en utilisant des techniques comme celle mentionnée ici:

http://defunc.com/blog/?p=94

Mais cela nécessite que l'utilisateur l'utilisation de 2 doigts pour faire défiler la div, ce qui n'est pas satisfaisant pour moi...

Des suggestions sur la façon de faire cela?

Merci,

Brad

Je suis également intéressé par la façon dont vous avez réellement résoudre ce problème, parce que j'ai peut-être besoin de faire cela un jour.
Le seul défilement au doigt peut être mis en œuvre à l'aide de jscroll.js. < & lt; a href="http://www.seabreezecomputers.com/tips/scroll-div.htm" >seabreezecomputers.com/tips/scroll-div.htm>?

OriginalL'auteur Brad Parks | 2009-03-05

  1. 6

    J'ai trouvé quelqu'un qui a mis en œuvre une solution réutilisable pour cela, avec un en-tête et un pied de page:

    http://cubiq.org/iscroll-4

    OriginalL'auteur Brad Parks

  2. 2

    Je ne suis pas trop familier avec la UIWebView, donc cela peut être totalement idiot suggestion. Mais est-il rien qui vous empêche d'avoir trois UIWebViews sur la page? L'un pour la tête, un pour le corps et un pour le pied de page. Parce que la rupture sonne comme une bonne idée.

    Il n'y a rien de m'arrêter de le faire, mais ensuite, je dois coordonner les points de vue de l'Objectif C. je préfère garder cela comme du pur HTML/JS/CSS puis il avait un port pour Android/PalmPre/AdobeAir type de choses plus facile.
    C'est cool. Les exigences fonctionnelles sont aussi valables que les techniques.

    OriginalL'auteur Benjamin Autin

  3. 2

    Est-ce que vous cherchez? Ouvrez ce lien sur votre appareil iPhone ou simulateur.

    L'index.html fichier a trois éléments div pour "en-tête", "conteneur" et "pied de page" directement sous le corps, tandis que tout le travail est fait dans le fixed.js fichier. Le document est fixé en place par l'annulation de l'action normale de l' "touchmove" de l'événement:

        //Disable flick events
    disableScrollOnBody : function() {
        document.body.addEventListener("touchmove", function(e) {
            e.preventDefault();
        }, false);
    },

    Ensuite, beaucoup de travail va dans la création des écouteurs d'événement pour les "évènements touchstart", "touchmove" et "touchend" des événements qui sont attachés à la "contenu" div " en vertu de "conteneur". La logique se résume à simplement déplacer le "contenu" de la div en haut et en bas.

    Cette solution est 100% en HTML/CSS/JavaScript, cependant, il ya certains WebKit propriété CSS et JavaScript qui peut limiter la portabilité. Il peut prendre un peu de peaufinage de travailler sur un autre appareil mobile, mais ce serait une bonne preuve-de-concept pour démarrer à partir d'.

    Je n'ai pas créer ce merveilleux exemple de projet, je suis contente de porter à l'attention de la communauté. Pour plus d'informations et un lien vers la zippé projet, lisez Richard "Doctyper" Herrara de l'ensemble de la post sur Correction du positionnement dans le navigateur Safari Mobile.

    OriginalL'auteur phatblat

  4. 1

    Peut-être maladroit, mais vous pouvez repositionner l'en-tête et pied de page sur le haut de la div que l'utilisateur fait défiler. De cette façon, votre principale div n'a pas besoin d'être déplacé. Aucune aide pour quoi que ce soit (encore) à l'aide de cadres.

    C'est l'un des plus irritants problèmes de navigateur avec l'iPhone/touch, je souhaite que vous pourriez juste se concentrer sur la partie de la page comme un navigateur.

    OriginalL'auteur Dana the Sane

  5. 0

    Pour un CSS de référence de la Safari de Référence CSS a probablement ce que vous cherchez. Vous serez particulièrement intéressé par tout ce qui commence par "-webkit" ou "-khtml" que ceux sont les propriétés étendues uniquement disponible avec WebKit comme la 3D et de la touche. Devrait s'appliquer à Android.

    Avec JavaScript la Introduction à WebKit DOM Sujets de Programmation et WebKit Référence de l'API DOM de passer des guides. Certainement jeter un oeil à la lumière de la table de démo pour certains copiez et collez code javascript sur la manipulation de vos touches que c'est comment je pourrais résoudre ce problème.

    OriginalL'auteur slf

  6. 0

    J'ai mis en œuvre iScroll sur iphone et c'est vraiment bon et rapide et vous pouvez faire ce que vous voulez. Les inconvénients sont que android (1.6) refuse de faire défiler la façon dont je voulais et parfois bloquer javascript si il y a de tout.

    OriginalL'auteur Marjan

  7. 0
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<div style="overflow: scroll">

    Les ajouter à votre code html peut résoudre votre problème.

    OriginalL'auteur rogers140