Show / Hide en javascript pour un tableau
12 messages • Page 1 sur 1
Consultez la formation au référencement naturel Google de WebRankInfo / Ranking Metrics
- soundtraker
- WRInaute discret

- Messages: 60
- Inscription: Lun Sep 19, 2005 23:17
Show / Hide en javascript pour un tableau
Slt,
J'ai beau chercher sur la toile, j'ai du mal à trouver un code javascript ou autre qui me permet d'afficher et cacher un tableau dès qu'on clique quelque part.
J'aimerai faire un bouton "Voir les commentaires" et onclick les afficher juste en dessous du bouton en fait...
Quelqu'un à une solution??
J'ai beau chercher sur la toile, j'ai du mal à trouver un code javascript ou autre qui me permet d'afficher et cacher un tableau dès qu'on clique quelque part.
J'aimerai faire un bouton "Voir les commentaires" et onclick les afficher juste en dessous du bouton en fait...
Quelqu'un à une solution??
j'ai fait ca dernierement.
voici comment j'ai procédé :
la fonction te permet d'afficher, ou de masquer le <div> dont l'id est équivalent à l'argument appellé dans la fonction.
ex :
il suffit de le modifier un peu (je vai te laisser chercher un peu quand meme, pour que tu comprenne) pour masquer le bouton B a l'appel de la fonction.
nb : tu appelle dans la fonction des class css, qui affichent ou masquent ton div.
voici comment j'ai procédé :
- Code: Tout sélectionner
function hide(identifiant) {
if (document.getElementById(identifiant).className == "hidden") {
document.getElementById(identifiant).className = "visible";
} else {
document.getElementById(identifiant).className = "hidden";
}
}
la fonction te permet d'afficher, ou de masquer le <div> dont l'id est équivalent à l'argument appellé dans la fonction.
ex :
- Code: Tout sélectionner
<input type="submit" onclick="javascript:hide('mondiv');" value="Bouton B" />
- Code: Tout sélectionner
<div id="mondiv" class="hidden" ><input type="submit" value="Bouton A" />
il suffit de le modifier un peu (je vai te laisser chercher un peu quand meme, pour que tu comprenne) pour masquer le bouton B a l'appel de la fonction.
nb : tu appelle dans la fonction des class css, qui affichent ou masquent ton div.
- Code: Tout sélectionner
.hidden {
display: none;
}
.visible {
display: inline;
}
- soundtraker
- WRInaute discret

- Messages: 60
- Inscription: Lun Sep 19, 2005 23:17
T'es trop fort! Ca fonctionne. T'es peux être l'ennemi de fredon mais ca va j't'en veux plus maintenant!
- soundtraker
- WRInaute discret

- Messages: 60
- Inscription: Lun Sep 19, 2005 23:17
oh un vrai gentil! J'avais pas remarqué qu'il avait une tete de méchant Gandalf! Mais bon j'ai vu que le dernier! me demande pas pkoi c'est illogique je sais!
KaZhaR a écrit:
- Code: Tout sélectionner
.hidden {
display: none;
}
.visible {
display: inline;
}
je croyais que les moteurs de recherche n'aimaient pas le texte caché par un display:none en css et du javascript. Moi j'uilise ca aussi sur mon site. C'est bien utile je trouve mais est ce que ca pose vraiment des problèmes pour le référencement ? la page risque pas d'être blacklistée ?
- soundtraker
- WRInaute discret

- Messages: 60
- Inscription: Lun Sep 19, 2005 23:17
écoutez, après avoir installé ce système sur pratiquement toutes les pages de mon site, je n'ai remarqué aucun effet néfaste! Google passe comme avant et indexe même certains contenu caché! (Je m'en sers pour afficher masquer les commentaires et c'est nickel!)
Re: Show / Hide en javascript pour un tableau
c'est toujours d'actualité ou non ?
moi j'ai un doute !! j'utilise ce code JavaScript pour cacher du texte sur une page, il s'agit d'un bloc de 5 liens, le texte est complètement caché aux visiteurs, mais on le voit dans le code source et en analysant la page avec lynx :
$(document).ready(function () {
// prettyBox
$("a[rel^='prettyPhoto']").prettyPhoto({theme: 'light_rounded'});
//Pour cacher une liste
$('span.prettyListe').hide();
// scroll jQuery Horizontal
$(function() {
//var originalSizes = new Array();
// this initialises the demo scollpanes on the page.
$('#pane1').jScrollHorizontalPane({scrollbarHeight:21, showArrows:true, arrowSize:21, wheelSpeed:200});
});
// remplacement img
$(function() {
$("#scrollPane img").hover(function() {
$(this).attr("src", $(this).attr("src").split(".").join("-hover."));
}, function() {
$(this).attr("src", $(this).attr("src").split("-hover.").join("."));
});
});
});
qu'en pensez vous ? cela pourrait-il nuire à mon référencement ?
moi j'ai un doute !! j'utilise ce code JavaScript pour cacher du texte sur une page, il s'agit d'un bloc de 5 liens, le texte est complètement caché aux visiteurs, mais on le voit dans le code source et en analysant la page avec lynx :
$(document).ready(function () {
// prettyBox
$("a[rel^='prettyPhoto']").prettyPhoto({theme: 'light_rounded'});
//Pour cacher une liste
$('span.prettyListe').hide();
// scroll jQuery Horizontal
$(function() {
//var originalSizes = new Array();
// this initialises the demo scollpanes on the page.
$('#pane1').jScrollHorizontalPane({scrollbarHeight:21, showArrows:true, arrowSize:21, wheelSpeed:200});
});
// remplacement img
$(function() {
$("#scrollPane img").hover(function() {
$(this).attr("src", $(this).attr("src").split(".").join("-hover."));
}, function() {
$(this).attr("src", $(this).attr("src").split("-hover.").join("."));
});
});
});
qu'en pensez vous ? cela pourrait-il nuire à mon référencement ?
12 messages • Page 1 sur 1
Formation recommandée sur ce thème :
Formation Référencement naturel Google : apprenez une méthode efficace pour optimiser à fond le référencement naturel dans Google de façon durable... Formation animée par Olivier Duffez et Fabien Facériès, experts en référencement naturel.
Tous les détails sur le site Ranking Metrics : programme, prix, dates et lieux, inscription en ligne.
Lectures recommandées sur ce thème :
- Google Analytics sur un téléphone Androïd
- Googlebot analyse certains codes JavaScript
- Protégez-vous contre le nofollow
- Google Video Store
- Sortie de GoogleStats v2.01
- Le simulateur de vol de Google Earth
- Optimisation du référencement d'un site en AJAX
- Historique des "Google Update"
- Comment faire des liens en dur dans son annuaire
- API Google Maps en Flash / Flex
Consultez la description détaillée des produits ou services de Google suivants : Google Related Links, Google Compute
Qui est en ligne
Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 0 invités






le forum