J'aimerais dupliquer la note de bas de page de la page de bas de page de Wikipedia à partir de la citation en texte cliquez sur uniquement dans les classes JQuery et CSS. J'ai trouvé une page Web qui décrit comment le faire avec CSS3 puis une solution JavaScript pour IE. Je voudrais cependant le faire uniquement avec JQuery comme le site que je le fais sur le site a déjà un groupe d'éléments JQuery.
J'ai proposé une liste du processus.
étiquette des notes de bas de page déjà en surbrillance.
- ajoutez la surbrillance à la note de bas de page appropriée
- Utilisez JQuery pour faire défiler la page sur la note de bas de page appropriée.
J'ai monté une jQuery jusqu'à présent, mais je suis extrêmement nouveau à celui-ci, en comptant lourd sur des tutoriels et des plugins à ce point. Voici ce que j'ai avec un peu anglais pour les parties que je n'ai pas encore compris. xxx Si j'avais une méthode pour transmettre une partie du sélecteur dans la fonction et transformez-le en une variable, je crois que je pourrais le retirer. Très probablement, je suis sûr que l'un de vous GURUS va fouiller quelque chose qui met tout en œuvre, je pense que j'ai fait pour honte. Toute aide sera grandement appréciée alors merci d'avance.
acclamations.
4 Réponses :
J'ai copié le balisage Superscript de Wikipedia Verbatim: et utilisé la jQuery suivant: la clé est saisissant le En outre, vous n'avez pas besoin de faire défiler la page vers le bas de manière programmatique, car Le navigateur gère cela automatiquement pour vous automatiquement. Voici un exemple de travail complet: http: // jsfiddle.net/andrewwwhiker/dkwjm/2/ Notes: Voici un exemple de ceci: http://jsfiddle.net/andrewwhiker/dkwjm / 4 / (mis à jour pour fonctionner dans IE8 / chrome / ff 3) href désactivé du lien qui a été cliqué, puis en l'utilisant pour sélectionner l'élément et appliquer la classe de surlignage.
event.preventDefault () ), qui serait de passer à l'élément avec le ID correspondant au lien cliqué sur href .
Animate pour faire défiler sans heurts le html Élément jusqu'à la position appropriée, qui est déterminé à l'aide de offset () sur l'élément cible.
argument (i spécifié 3000) est ce que vous modifiez pour allonger / raccourcir la durée du défilement.
CSS devrait vraiment avoir un sélecteur pour le fragment d'ancrage actuellement actif. Ce type de fonctionnalité ne devrait pas nécessiter de demander à JS.
@ Lèse: il y a un sélecteur CSS3 qui fait cela ( thinkvitamin.com/design/stay-on -Target ), il n'est tout simplement pas pris en charge par IE :(
Ah, je suppose que j'aurais dû lire la question mieux. Eh bien, espérons-le, c'est-à-dire que cela finira par le soutenir.
Cela semble bon, je vais essayer demain. La raison pour laquelle je veux utiliser JQuery pour glisser est pour la glissière animée plutôt que le comportement du navigateur standard.
Je viens de recommencer à travailler sur le projet. Jusqu'à présent, le script appliqué ne fonctionne pas.
Quels problèmes as-tu?
Eh bien, j'ai branché et édité les cours pour mes besoins et cela n'a rien fait. J'ai aussi essayé votre exemple de travail qui n'a rien fait.
@ Andrew.bachman: On dirait que cela ne fonctionne pas dans Chrome (désolé pour ça). Est-ce le navigateur que vous utilisez par hasard?
@ Andrew.bachman: J'ai mis à jour l'exemple et la réponse au travail à Chrome / IE / FF. S'il vous plaît laissez-moi savoir si vous avez toujours des problèmes.
On dirait que c'était la question, mais j'avais testé à FF sans être en vain. Le nouvel exemple fonctionne bien! Merci beaucoup, je vais le mettre en œuvre dans la page et faire rapport.
Voici une meilleure idée - utilisez #hash code> liens pour faire la liaison, puis l'améliorer avec une jQuery. Dans votre HTML: if(location.hash) $(location.hash).addClass('highlight');
Peut-être que la meilleure approche ouvrirait une info-bulle avec les détails de référence au lieu de sauter de haut en bas. Plugin simple et soie est à: http://livereence.org en plus de la lecture de référence définie par l'utilisateur, il peut récupérer automatiquement les détails de la publication à partir d'un ISBN ou d'un identifiant PUBMED donné.
Il n'est plus nécessaire d'utiliser jQuery pour cela; Le CSS3 Référence: Comment mettre en valeur dynamiquement le contenu comme Wikipedia à l'aide de CSS3 : cible pseudo-classe fait maintenant cela de manière pure-CSS.