2009-08-25 5 views
0

J'ai créé une page sur laquelle j'ai essayé d'obtenir l'effet de la barre d'outils alignée en bas comme le livre d'un visage a. Pour que je fait un div avec le plus z-index régler la position de fixe et régler le 0 fond commeHTML COUCHES CSS

#bar 
{ 
z-index : 11; 
position : fixed; 
bottom : 0; 
height : 50; 
left  : 0; 
right : 0; 
} 

il fonctionne très bien, mais pendant le défilement, il semble que la page prend le rendu de temps, comme la page est lourde, le défilement est lisse mais le rendu de la page est juste un peu lent qui produit un effet de défilement pas si bon. Est-ce que quelqu'un sait whats up ...

ou vous ne me chercher même: p

+0

Dans quels navigateurs avez-vous testé cela? – AnthonyWJones

+0

Firefox & IE & Chrome ... – Moon

+0

Dans quel (s) navigateur (s) est-ce que cela se passe? Etes-vous sûr que c'est l'élément qui a causé le problème (cela n'arrive-t-il pas quand il est commenté?) – edeverett

Répondre

2

Position: fixe en elle-même ne doit pas être à l'origine de ces problèmes.

Il semble que les navigateurs ne font que ralentir le rendu de votre page. La page est-elle grande ou compliquée? Cela pourrait être causé par un code HTML, CSS et surtout Javascript compliqué.

Essayez de simplifier (ou de désactiver, pour JS) chacun à son tour.

(je regarderais dur à tout événement JS ou CSS et qui utilise le sélecteur *.)

+0

non son pas comme une seule page avec un fond d'une couche avec un fond répétitif et quelques images .. ..si vous pouvez vérifier s'il vous plaît je vous l'envoie par mail ... – Moon

+0

Si vous mettez la page sur Internet et ajoutez un lien ici, je vais probablement avoir le temps pour un coup d'oeil. Vous aurez probablement aussi des idées d'autres personnes. Si la page contient un contenu sensible, supprimez-le de l'exemple. – edeverett

0

Si vous avez un « background-attachment: fixed » règle qui peut aussi causer des problèmes similaires. Une autre chose à laquelle vous devez faire attention est que IE6 ne supporte pas position: fixed, donc vous devez le faire avec JavaScript - ce qui ralentit également le site web.

1

Si cette barre inférieure est au bas du code HTML, elle sera chargée (et rendue) après tout le reste. Si le reste de la page est gros (code stupide, javascripts complexes ou images géantes), cela va probablement empirer les choses, car les styles sont appliqués plus ou moins continuellement au fur et à mesure du chargement de la page.

Façon simple de vérifier ceci: Recréez la barre du bas à une page super simple et voir si vous obtenez le même effet. Si oui, votre page est probablement trop grande ou compliquée.

Ou votre ordinateur est tout simplement lent :-)