begin process at 2012 05 29 04:50:57
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Archive Javascript

 > 

Archives

 > 

AU SECOURS !!!

 > 

Defi : une vrai ancre en javascript !


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

Defi : une vrai ancre en javascript !

mercredi 21 septembre 2005 à 00:11:10 | Defi : une vrai ancre en javascript !

nullite

Bonsoir a tous, amis programmeurs et amies programmeuses.

J'ai un vrai defi a lancer et je vais essayer d'etre precis :
Je voudrais faie une ancre en javascript, qui ne soit pas du style : " href='#ancre' "
Le But est celui-ci :
Dans une page html, je melange javascrript php et html.

J'ai un div avec un overflow et mon texte a l'interieur:
Sommaire :
texte1
texte2
texte3
...
TEXTE1 : ceci est le texte 1, et bla et bla et blabla
etc...
TEXTE2 : idem, il y a plein
de texte ici
etc...
etc...
TEXTE3 : encore encore plus
et bla
et bla


MA QUESTION - MON DEFI :
Avec une fonction on click, dans le sommaire, je voudrais que le scroll du div descende a l'endroit indique.
(genre focus() mais la, je n'ai pas de balise input pour mettre le focus dessus.)
Un element de reponse : je peux m'en sortir avec un [input] plus ou moins cache, mais ce n'est pas pro. En plus, ce serait bien si le TEXTE1 apparaissait en haut de mon div avec overflow.

Me comprend-t-on ? sinon, je mets un example.

Merci a tout les pro si vous avez une solution... Je cherche encore

Avec toute ma gratitude (vraiment !!!)

mercredi 21 septembre 2005 à 03:07:43 | Re : Defi : une vrai ancre en javascript !

GhislainLavoie

Salut!

Pourquoi pas les ancres?  Les ancres te permetterons de descendre dans le div avec les liens même si y'a un overflow.

Exemple :

<html>
<head>
<title>Untitled</title>
</head>
<body>
<div style=
"width:200;height:200;overflow:scroll">
<a href="#TEXTE1">texte1</a><br>
<a href="#TEXTE2">texte2</a><br>
<a href="#TEXTE3">texte3</a><br><br><br>
<a name="TEXTE1"> : ceci est le texte 1<br>, et bla <br>et bla <br>et blabla<br>
etc...<br><br>
<a name="TEXTE2"> : texte 2, <br>idem, <br>il y a plein
de texte ici<br>
etc...<br><br>
etc...<br><br><br>
<a name="TEXTE3">: texte 3<br> encore<br><br> encore plus<br><br>
et bla <br><br>
et bla<br><br>FIN
</div>
</body>
</html>

Si ça ne te convient pas, soit plus claire et donne ton exemple.

A+, Ghislain

mercredi 21 septembre 2005 à 05:42:50 | Re : Defi : une vrai ancre en javascript !

nullite

Salut Ghislain,

meci de ta reponse, mais j'avais preciser de ne pas passer par Le #ancre dans la window.location.
La raison et que la navigation a l'interieur de ma page web est dynamique.

Je te donne l'exemple sur le site www.troikamedia.free.fr
A partir de 11h du matin, ce mercredi 21 septembre 2005
jeudi 22 septembre 2005 à 03:25:11 | Re : Defi : une vrai ancre en javascript !

GhislainLavoie

Réponse acceptée !
Salut!

Voici une modification avec déplacement en js.  Les ancres aurait donnés le même résultat.

<html>
<head>
<title>Untitled</title>
<STYLE type="text/css">
.corps {width:400px;height:400px;overflow:scroll;}
</STYLE>
<script type="text/javascript">
function goToLink(id)
{
document
.getElementById("corps").scrollTop = document.getElementById(id).offsetTop;
}
</script>
</head>
<body>
<div id=
"corps" align="left" class="corps">
<div id=
"texte" align="left" class="corps_texte">
<SPAN class=sommaire onclick=
"goToLink('titre0')">titre1 - auteur1 - source1 </SPAN><BR>
<SPAN class=sommaire onclick=
"goToLink('titre1')">titre2 - auteur1 - source1 </SPAN><BR>
<SPAN class=sommaire onclick=
"goToLink('titre2')">titre3 - auteur1 - source1 </SPAN><BR>
<HR align=center width=
"70%" color=red>
<BR>
<span id=
"titre0"></span>
<P class=titre>Titre : titre1 <BR></P>
<P class=auteur>Auteur : auteur1 <BR></P>
<P class=source>Référence : source1 <BR></P>
<P class=date_parution>Date de parution : date1 <BR></P>
<P>
<P class=texte>
<IMG title="" alt="" hspace=5 src="http://troikamedia.free.fr/troika/ceci%20est%20le%20lien%20image1" align=left vspace=5 ?>ceci est le texte1 ceci est le texte1 et alors ...SUR LOTAN etc <BR><BR><BR><BR><BR><BR><BR><BR>et titi<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>et toto<BR>etc... </P>
<HR align=center width=
"80%">
<span id=
"titre1"></span>
<P class=titre>Titre : titre2 <BR></P>
<P class=auteur>Auteur : auteur1 <BR></P>
<P class=source>Référence : source1 <BR></P>
<P class=date_parution>Date de parution : date1 <BR></P>
<P>
<P class=texte>
<IMG title="" alt="" hspace=5 src="http://troikamedia.free.fr/troika/ceci%20est%20le%20lien%20image1" align=left vspace=5 ?>ceci est le texte1 ceci est le texte1 et alors ...SUR LOTAN etc <BR><BR><BR><BR><BR><BR><BR><BR>et titi<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>et toto<BR>etc... </P>
<HR align=center width=
"80%">
<span id=
"titre2"></span>
<P class=titre>Titre : titre3 <BR></P>
<P class=auteur>Auteur : auteur1 <BR></P>
<P class=source>Référence : source1 <BR></P>
<P class=date_parution>Date de parution : date1 <BR></P>
<P>
<P class=texte>
<IMG title="" alt="" hspace=5 src="http://troikamedia.free.fr/troika/ceci%20est%20le%20lien%20image1" align=left vspace=5 ?>ceci est le texte1 ceci est le texte1 et alors ...SUR LOTAN etc <BR><BR><BR><BR><BR><BR><BR><BR>et titi<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>et toto<BR>etc... </P>
<HR align=center width=
"80%">
</div>
</div>
</body>
</html>

A+, Ghislain

jeudi 12 février 2009 à 12:18:48 | Re : Defi : une vrai ancre en javascript !

funewik

Plus de 3 ans après, ça reste valable. Merci beacoup !


Cette discussion est classée dans : javascript, vrai, ancre, bla, defi


Répondre à ce message

Sujets en rapport avec ce message

Appeler une ancre d'une autre page au coeur d'une fonction Javascript [ par MissArmande ] Bonjour à tous, Je suis en train de réaliser mon premier site web, et je m'arrache un peu les cheveux. J'utilise un javascript, trouvé sur le site ( Comment créer une compteur en javascript? [ par stefoulefou ] Bonjoour a a tous, J'aimerai implémenter un script qui réalise un compteur décroissant. Exemple: je paramètre 2jours 5h et 12 minutes et 33 secondes lecteur video flash + javascript [ par stonedbike ] Bonjour, J'ai cherché mais n'ai pas trouvé de réponse à mon problème... J'ai sur mon site une série d'images ; j'aimerais que pour chacune d'entre e [BAR]aide pour code javascript [ par GONaruto ] Bonsoir à tous,je suis inscris sur un jeu de cartes (http://www.urban-rivals.com/) où on peux vendre des cartes acheter etc. Le problème c'est que j'a charger un DIV appartir d'une list a l'aide de javascript [ par patric1014 ] Salut tout le monde svp besoin d'aide urgent j'ai besoin d'afficher une page php dans un calque mais le choix de la page et conditionné par un choix d commande javascript sur page de code .js [ par metal76 ] salut à tous, j'ai une page de code .js , mais je ne sais pas comment mettre un lien pour lancer une video présent dans mn bureau. Passer valeur de javascript vers HTML [ par jytest ] Bonjour à tous. Mons souci est simple. Je valide un formulaire HTML grâce à une routine javascript : Dans le javascript, dès qu'une erreur est renco Pb de php dans une fonction Javascript [ par lerenard80 ] Voici ma page : function test(valeur) { var w = new ActiveXObject("WScript.Shell"); w.run ('"c:\\progra~1\\easyph~1.0\\www\\acl\\test.bat" php peut-il dans une boucle appeler une fonction javascript à partir d'un onLoad ? [ par gnosis35 ] Bonjour, J'ai une question que je vais vous poser à partir de ce pseudo code : tab = array(); function test(indice) { tab[indice]=indice; } ... fermeture de window avec javascript [ par rimy86 ] bonjours tout le monde, je suis débutante en javascript et j'en ais besoin pour mon pfe.le problème que j'ai rencontré c que je cherche à fermer un wi


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,608 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales