| [TOUTES VERSIONS] Bouton générateur de tableaux | |
|
+15Splash ThunderTB alla13 Kaeyla dragon594 Sacha Grande013 dédé54 McLeod mariok gehem94 patriciadpt30 Rumbelle85 Milouze14 fascicularia 19 participants |
Auteur | Message |
---|
fascicularia
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: [TOUTES VERSIONS] Bouton générateur de tableaux Mer 16 Juil 2014 - 6:23 | |
| Bonjour à tous, Ce tutoriel vous permettra d'installer un bouton qui donnera la possibilité à vos membres de générer des tableaux sans en avoir à constituer la trame. Le résultat en image ![[TOUTES VERSIONS] Bouton générateur de tableaux Sans_t57](https://i.servimg.com/u/f39/11/93/85/24/sans_t57.png) Pour commencer : 1/installer ce js dans la gestion des javascripts sans lui affecter un placement précis. - Code:
-
function generer() {
// On affecte les saisies a des variables pour plus de commodite var cellspacing = document.formulaire.cellspacing.value; var cellpadding = document.formulaire.cellpadding.value; var width = document.formulaire.width.value; var border = document.formulaire.border.value; var lignes = document.formulaire.lignes.value; var colonnes = document.formulaire.colonnes.value;
// Debut de l'ecriture du tableau dans le champ resultat document.formulaire.resultat.value = '<table ';
// on affecte chaque variable a son attribut dans le tableau document.formulaire.resultat.value += 'cellspacing="' + cellspacing + '" '; document.formulaire.resultat.value += 'cellpadding="' + cellpadding + '" '; document.formulaire.resultat.value += 'width="' + width + '" '; document.formulaire.resultat.value += 'border="' + border + '">\n';
// on cree chaque ligne for ( i = 0; i < lignes; i++ ) { document.formulaire.resultat.value += '\t<tr>\n';
// on cree chaque colonne for ( j = 0; j < colonnes; j++ ) { document.formulaire.resultat.value += '\t\t<td></td>\n'; }
// fermeture de chaque ligne document.formulaire.resultat.value += '\t</tr>\n'; }
// fermeture du tableau document.formulaire.resultat.value += '</table>'; } 2/ récupérez le lien de votre javascript . http://altitudetropicale.forums-actifs.com/49472.js3/ Créez une page html: Voulez-vous utiliser le haut et le bas de page de votre forum ? NonDéposez ce contenu et, insérez le lien de votre js dans la partie intitulée "Lien de votre js". - Code:
-
<html> <head>
<SCRIPT src="Lien de votre js"></SCRIPT>
</head> <body> <center><TABLE bgcolor="#f3eee4" align="center" style="border-width : 1; border-color : #b4ad9e; border-style : solid; font-family : Arial, Helvetica, sans-serif; font-size : 8pt;"> <tr><td align="center" bgcolor="#f3eee4"><font color="#000000"><b>.: Générateur de tableaux :.</b></font></td></tr> <form name="formulaire"> <tr><td align="center"><br><font color="#000000">Espace entre les cellules :</font><br><input type="text" name="cellspacing" size="5" value="0" OnFocus="this.select();"></td></tr> <tr><td align="center"><font color="#000000">Marge dans les cellules :</font><br><input type="text" name="cellpadding" size="5" value="0" OnFocus="this.select();"></td></tr> <tr><td align="center"><font color="#000000">Largeur tableau :</font><br><input type="text" name="width" size="5"></td></tr> <tr><td align="center"><font color="#000000">Bordure du tableau :</font><br><input type="text" name="border" size="5" value="0" OnFocus="this.select();"></td></tr> <tr><td align="center"><font color="#000000">Nombre de lignes :</font><br><input type="text" name="lignes" size="5"></td></tr> <tr><td align="center"><font color="#000000">Nombre de colonnes :</font><br><input type="text" name="colonnes" size="5"></td></tr> <tr><td align="center"><br><input type="button" value="Generer" OnClick="generer();"> <input type="reset" value="Effacer"></td></tr> <tr><td align="center"><textarea name="resultat" cols="28" rows="10"></textarea><br><br></td></tr> </form></table></center> </body> </html> 4/Récupérer le lien de cette page HTML avec le même principe que celui du javascript cad en écourtant l'url. 5/Nous créons un autre javascript qui cette fois ci va servir à créer un bouton. A la place de Lien de votre page html, vous insérez l'url écourtée de la page html. Vous cochez "sur toutes pages" afin que le bouton soit accessible sur les deux éditeurs. - Code:
-
/* Générateur */ $(document).on('ready', function () { $(".sceditor-container").append('<div class="sceditor-dropdown sceditor-newtab" style="display:none;margin-top: 27px;"><iframe src="Lien de votre page html" scrolling="true" allowtransparency="true" frameborder="0" width="300" height="520"></iframe></div>'); $('<a class="sceditor-button bbcode-upload" title="Générateur de tableaux"><div style="background-image:url(http://i.imgur.com/vU0Y04s.png)">Upload</div></a>').insertAfter('.sceditor-button-fahide').click(function () { $(".sceditor-newtab").css({ "left": $(this).position().left, "top": $(this).position().top, }); $(".sceditor-newtab").toggle(); }); }); Les modifications possibles sur le dernier javascript Modifier l'image du bouton - Code:
-
background-image:url(http://i.imgur.com/vU0Y04s.png) Modifier le positionnement du bouton. Dans le script il est placé juste après le bouton hide(caché) - Code:
-
sceditor-button-fahide Nous avons terminé
Dernière édition par fascicularia le Jeu 17 Juil 2014 - 22:16, édité 3 fois | |
|
 | |
Milouze14
Fondateur

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Mer 16 Juil 2014 - 6:36 | |
|  Stéphane, merci bien | |
|
 | |
Rumbelle85
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Sam 23 Aoû 2014 - 18:11 | |
| merci, c'est vraiment utile ;) | |
|
 | |
patriciadpt30
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Mer 1 Avr 2015 - 15:19 | |
| | |
|
 | |
gehem94
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Sam 9 Mai 2015 - 21:54 | |
| Je sens que je vais encore être très redevable à fascicularia. Merci. | |
|
 | |
Invité Invité

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Dim 10 Mai 2015 - 6:08 | |
| |
|
 | |
Invité Invité

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Mar 12 Mai 2015 - 12:13 | |
| Merci !  |
|
 | |
mariok
Membre regretté

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Jeu 11 Juin 2015 - 8:39 | |
| | |
|
 | |
McLeod
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Jeu 24 Sep 2015 - 13:58 | |
| | |
|
 | |
dédé54
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Ven 25 Sep 2015 - 12:56 | |
| | |
|
 | |
Grande013
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Dim 27 Sep 2015 - 17:02 | |
| | |
|
 | |
Sacha
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Sam 17 Oct 2015 - 0:03 | |
| | |
|
 | |
dragon594
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Dim 10 Avr 2016 - 22:38 | |
| | |
|
 | |
Invité Invité

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Lun 18 Avr 2016 - 4:22 | |
| |
|
 | |
Invité Invité

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Ven 24 Juin 2016 - 20:48 | |
| Bonsoir,
Merci infiniment Stéphane pour ce magnifique partage |
|
 | |
Kaeyla
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Lun 17 Avr 2017 - 7:20 | |
| | |
|
 | |
alla13
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Lun 7 Mai 2018 - 18:13 | |
| | |
|
 | |
ThunderTB
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Mar 6 Nov 2018 - 5:22 | |
| | |
|
 | |
Splash
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Mar 6 Nov 2018 - 6:08 | |
| | |
|
 | |
chegau2
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Sam 24 Nov 2018 - 2:35 | |
| | |
|
 | |
Ptite_Perle
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Jeu 28 Mar 2019 - 15:01 | |
| | |
|
 | |
.Volubal.
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Mar 9 Avr 2019 - 17:08 | |
| | |
|
 | |
BarTender
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Ven 21 Fév 2020 - 14:46 | |
| je n y arrive pas je bloque a se niveau 4/Récupérer le lien de cette page HTML avec le même principe que celui du javascript cad en écourtant l'url. 5/Nous créons un autre javascript qui cette fois ci va servir à créer un bouton. A la place de Lien de votre page html, vous insérez l'url écourtée de la page html. Vous cochez "sur toutes pages" afin que le bouton soit accessible sur les deux éditeurs. | |
|
 | |
Milouze14
Fondateur

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Ven 21 Fév 2020 - 15:04 | |
|
Dernière édition par Milouze14 le Ven 21 Fév 2020 - 15:43, édité 2 fois | |
|
 | |
BarTender
Milouzien

![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux Ven 21 Fév 2020 - 15:31 | |
| | |
|
 | |
Contenu sponsorisé
![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | Sujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux ![[TOUTES VERSIONS] Bouton générateur de tableaux Empty](https://2img.net/i/empty.gif) | |
| |
|
 | |
| [TOUTES VERSIONS] Bouton générateur de tableaux | |
|