28172 sujets

CSS et mise en forme, CSS3

Liens avec ancres

Pages :
bonjour à tous,

j'ai conçu une navigation horizontale.
Pour que les liens du menu fonctionnent, j'ai placé des ancres dans chaque <div> qui constituent une rubrique.
Le pb reste : le lien ne positionne pas exactement l'ascenseur au début du div (rubrique) mais à la moitié avant ou la moitié après...
Bon, c'est compliqué à expliquer, vous pouvez voir l'effet sur http://a.mydlarz.free.fr

quelqu'un aurait-il une idée lumineuse pour que le bloc se positionne correctement ?

merci merci!
siu
Bonjour,
j'ai le même problème.
As-tu trouvé une solution depuis ?…
Si oui, un petit coup de main serait le bien venu…!
La seule solution trouvée pour l'instant, c'est que l'identifiant (ancre) appelé fasse la même largeur que la "fenêtre" (div en overflow:hidden). Sinon, ça n'est jamais bien calé, surtout en fin de liste, forcément.
Enfin je ne sais pas si je suis clair…!!
En plus, je viens de me rendre compte que les ancres dans un div en overflow:hidden ne fonctionnent pas sous Opera (Version 10.10 Mac OS X).
Merci en tout cas.
bonjour,

j'ai mis le site en place sur www.object.fr et j'ai donc résolu le pb.

vous pouvez regarder dans le code, et notamment au niveau du menu : 
<li id="menuhome">   <a onclick="$.scrollTo( { top:0,left:0},800 );" >


et le fichier "scroll.js"

siu
Smiley cligne
Hello Siu,
j'ai ajouté (au html présenté dans le topic cité + haut) des liens vers tes scripts scroll.js + jquery, et le code du bouton avec les coordonnées x et la hauteur (800 c'est bien la hauteur de la "fenêtre" de visualisation?) mais rien ne bouge (dans aucun navig).
D'après toi, qu'est-ce que j'oublie ?
as-tu bien vérifié le lien vers ton fichier javascript "scroll" : est-il ok ?
<script type="text/javascript" src="themes/scroll.js"></script>


as-tu bien le lien vers le fichier de la bibliothèque jquery ?
<script type="text/javascript" src="themes/jquery_1.3.2.js"></script>


Pour les coordonnées, oui, 800px est bien la hauteur.

Ton site est-il construit exactement de la même manière ?
As-tu une url ?
ça n'est pas un pb de lien, j'ai aussi copié la source de ton site et la nav fonctionne en interne.
Ma page de test est sur le topic cité + haut (fichier test sans images ni lien externe, et sans ton code bouton et tes lien js que j'ai ajoutés par la suite).
ça doit être une question de structure CSS, mais je n'arrive pas à trouver l'élément déterminant…
Merci pour ton aide.
Et sur cette page, la solution de base (ancres dans id + petit js pour les flèches de scroll, dans une "fenêtre"/div en overflow:hidden) qui ne fonctionne pas dans Opera (Opera v° 10.10 + Mac OS 10.5.8) mais OK dans FF et Safari (pas testé IE).
Je crois que ta solution fonctionne tout bêtement parce que ton div container global "#wrap_documentary" n'est pas en overflow:hidden, et qu'il y a la barre de scroll horizontale.
Qu'en penses-tu ?
en effet, je confirme, il n'y a pas de overflow:hidden (!)

oui #wrap_documentary = container global

la barre de scroll horizontale ne s'affiche pas parce que j'aurais mis un paramètre spécifique, mais le navigateur l'affiche automatiquement, compte tenu de la largeur du site : width:6310px;

ensuite chaque bloc (type id="pagehome", id="pageshows", etc.) est en float:left;

en fait, tu veux combiner 2 techniques qui ne sont pas compatibles :

- l'overflow:hidden, c'est par exemple ce que j'ai utilisé pour le module "texte défilant" dans le 1er bloc qui représente la home - il y a en effet un contenu caché (voir fichier javascript "slider.js")

- le reste du site, rien n'est caché - tout est sur le même plan d'emblée, accessible - les blocs floatent les uns à côté des autres. Et c'est le fade appliqué à chacun d'entre eux qui les fait s'afficher au survol de la souris dessus.
<div id="content" class="fade">
oui mais alors là il me semble que tu compliques ta conception pour rien : pourquoi veux-tu coupler les 2 modes de fonctionnement ? un peu comme vouloir faire à la fois un carré et un cercle...

la page que tu me montres reprend seulement ce que j'ai utilisé pour le module défilant sur ce qui représente ma home... (slider.js) - sauf que ce sont des images à l'intérieur, mais c'est tout...

je ne comprends pas ce que tu veux obtenir au final...
Ce que je veux obtenir, c'est ça, mais avec des ancres (les boutons 1 2 3 4 5 ) qui fonctionnerait sous Opera+Mac et avec un scroll (les boutons < >) si possible + fluide (le déplacement donne un effet tremblotant pas terrible).
(…suite) On dirait une commande pour le père Noël !…
Merci pour ces liens et pour ton aide, je vais creuser la question.
Le seul détail qui manque c'est le scroll en continu onmouseover; utile dans la mesure ou les items 1 2 3 4 5… à scroller n'auront pas la même largeur dans le projet final.
Pages :
Sujet clos
Aller à