Astuces Forumactif
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.
Astuces Forumactif

EDGE/ PHPBB2 / PHPBB3/ PUNBB / INVISION/ MODERNBB/ AWESOMEBB
 
AccueilAccueil  PortailPortail  Connexion  S'enregistrerS'enregistrer  
-47%
Le deal à ne pas rater :
La carte Fnac+ à 7.99€ pour 1 an
7.99 € 14.99 €
Voir le deal

 

 [TOUTES VERSIONS] Bouton générateur de tableaux

Aller en bas 
+15
Splash
ThunderTB
alla13
Kaeyla
dragon594
Sacha
Grande013
dédé54
McLeod
mariok
gehem94
patriciadpt30
Rumbelle85
Milouze14
fascicularia
19 participants
AuteurMessage
fascicularia
Milouzien

fascicularia



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyMer 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





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.js



3/ Créez une page html:
Voulez-vous utiliser le haut et le bas de page de votre forum ? Non

Dé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
Revenir en haut Aller en bas
https://altitudetropicale.forums-actifs.com/
Milouze14
Fondateur

Milouze14



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyMer 16 Juil 2014 - 6:36

coucou Stéphane,

merci bien  clin oeil 
Revenir en haut Aller en bas
https://www.milouze14.com
Rumbelle85
Milouzien

avatar



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptySam 23 Aoû 2014 - 18:11

merci, c'est vraiment utile ;)
Revenir en haut Aller en bas
http://storybrookerpg.forumactif.org/
patriciadpt30
Milouzien

patriciadpt30



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyMer 1 Avr 2015 - 15:19

merci cool :)
Revenir en haut Aller en bas
gehem94
Milouzien

avatar



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptySam 9 Mai 2015 - 21:54

Je sens que je vais encore être très redevable à fascicularia. Merci.
Revenir en haut Aller en bas
http://fontenayplateau.net
Invité
Invité
Anonymous



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyDim 10 Mai 2015 - 6:08

merci bien
Revenir en haut Aller en bas
Invité
Invité
Anonymous



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyMar 12 Mai 2015 - 12:13

Merci ! clin oeil
Revenir en haut Aller en bas
mariok
Membre regretté

mariok



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyJeu 11 Juin 2015 - 8:39

Merci beaucoup !
Revenir en haut Aller en bas
http://www.amarid.net
McLeod
Milouzien

avatar



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyJeu 24 Sep 2015 - 13:58

Merci beaucoup !
Revenir en haut Aller en bas
http://www.villapaintball.fr
dédé54
Milouzien

dédé54



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyVen 25 Sep 2015 - 12:56

Merci beaucoup !
Revenir en haut Aller en bas
http://le-piegeage.1fr1.net/
Grande013
Milouzien

avatar



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyDim 27 Sep 2015 - 17:02

Merci beaucoup !
Revenir en haut Aller en bas
Sacha
Milouzien

Sacha



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptySam 17 Oct 2015 - 0:03

Merci beaucoup !
Revenir en haut Aller en bas
https://amis-pub.forumactif.com/
dragon594
Milouzien

dragon594



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyDim 10 Avr 2016 - 22:38

Merci beaucoup !
Revenir en haut Aller en bas
https://dragon-graphisme59.forumactif.org/
Invité
Invité
Anonymous



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyLun 18 Avr 2016 - 4:22

Merci beaucoup !
Revenir en haut Aller en bas
Invité
Invité
Anonymous



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyVen 24 Juin 2016 - 20:48

Bonsoir,

Merci infiniment Stéphane pour ce magnifique partage
Revenir en haut Aller en bas
Kaeyla
Milouzien

Kaeyla



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyLun 17 Avr 2017 - 7:20

Merci beaucoup !
Revenir en haut Aller en bas
https://sweethome.forumactif.com
alla13
Milouzien

alla13



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyLun 7 Mai 2018 - 18:13

merci pour le code
Revenir en haut Aller en bas
http://alla-omar.yoo7.com
ThunderTB
Milouzien

ThunderTB



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyMar 6 Nov 2018 - 5:22

Merci beaucoup !
Revenir en haut Aller en bas
http://hockeyfederation.forumgratuit.org/forum
Splash
Milouzien

Splash



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyMar 6 Nov 2018 - 6:08

Merci beaucoup !
Revenir en haut Aller en bas
https://lesforums.caforum.fr
chegau2
Milouzien

avatar



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptySam 24 Nov 2018 - 2:35

Merci beaucoup !
Revenir en haut Aller en bas
http://michegau.free.fr/
Ptite_Perle
Milouzien

Ptite_Perle



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyJeu 28 Mar 2019 - 15:01

Merci
Revenir en haut Aller en bas
https://forumcrea.forumactif.org/
.Volubal.
Milouzien

avatar



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyMar 9 Avr 2019 - 17:08

Merci beaucoup
Revenir en haut Aller en bas
http://columbiahighschool.forumactif.com/
BarTender
Milouzien

avatar



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyVen 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.

Revenir en haut Aller en bas
https://chezbabygraph.forumactif.com/
Milouze14
Fondateur

Milouze14



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyVen 21 Fév 2020 - 15:04

Hello
Ce forum n'a pas pour vocation d'apporter d'autre explication sur le tutoriel présent.
Si ce dernier n'est pas assez explicite:
Le forum d'entraide est prévu à cet effet.


Dernière édition par Milouze14 le Ven 21 Fév 2020 - 15:43, édité 2 fois
Revenir en haut Aller en bas
https://www.milouze14.com
BarTender
Milouzien

avatar



[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux EmptyVen 21 Fév 2020 - 15:31

ok merci

Revenir en haut Aller en bas
https://chezbabygraph.forumactif.com/
Contenu sponsorisé





[TOUTES VERSIONS] Bouton générateur de tableaux Empty
MessageSujet: Re: [TOUTES VERSIONS] Bouton générateur de tableaux   [TOUTES VERSIONS] Bouton générateur de tableaux Empty

Revenir en haut Aller en bas
 
[TOUTES VERSIONS] Bouton générateur de tableaux
Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» [TOUTES VERSIONS] Toutes versions Bouton générateur d'iframes
» [TOUTES VERSIONS] Créer un générateur d'image cliquable
» [TOUTES VERSIONS] Masquer le bouton j'aime pas ou j'aime a un membre
» [TOUTES VERSIONS] Menu sur 2 colonnes
» [TOUTES VERSIONS] Edition rapide

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Astuces Forumactif :: Astuces Forumactif :: Toutes versions-
Sauter vers: