It is currently Wed 28 Sep 2016 - 20:45 - créer un forum

[Tuto] Un bloc avec Menu Scroll

Skip to content

Post new topic Reply to topic Goto page: 1, 2, 3, 4  >

[Tuto] Un bloc avec Menu Scroll
Author Message
Sploutch
Membre


Offline
Membre

Joined: 02 Jan 2006
Posts: 584
Niveau:
Point(s): 632
Moyenne: 1.08
Masculin

PostPosted: Mon 14 May 2007 - 12:56    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

PublicitéSupprimer les publicités ?

  • Titre: Menu Scroll
  • Version: 1.0

  • Auteur: sploutch
  • Contact Auteur: Avec ma fiche de contact ICI
  • Source: Moi même-presencenet

  • Description: Ce tuto vous permet d'avoir un bloc, avec avec un menu scroll pour par exemple en faire un bloc de navigation original.

  • Niveau d'installation: Facile
  • Temps d'installation: 2-3 Minutes.
  • Nombre de template a modifié : En principe aucune, sauf si vous souhaitez intégrer cette fonction sur l'une de vos pages. (comme dans mon second exemple)

  • Fonctionne sur les thémes : xooit, phpBB.
  • Test effectué sur : xooit, phpBB2.
  • Defaut : Aucun.
  • exemple : Sur cette page, le bloc au titre de :
Menu Scroll en haut a droite, ou ICI ou je l'ai intégré dans posting_body.tpl pour le faire apparaitre à côté du bloc ou on compose un message. Image


    Installation :

    Sauvegardez vos templates, image avant toute modification




Créez un module par exemple (ou une template selon votre choix d'emplacement si vous décidez de le mettre sur une de vos pages.) que vous appellerez "Menu rapide" (par exemple)

Cliquez sur le "<>" , puis rentrez le code ci-dessous.


Code: Sélectionner - Agrandir
<SCRIPT>
var sRepeat=null;
function doScrollerIE(dir, src, amount) {   
if (amount==null) {
amount=10
}   
if (dir=="up") {
document.all[src].scrollTop-=amount
}   else {
document.all[src].scrollTop+=amount
}   if (sRepeat==null) {
sRepeat = setInterval("doScrollerIE('" + dir + "','" + src + "'," + amount + ")",100)}   return false
}
window.document.onmouseout = new Function("clearInterval(sRepeat);sRepeat=null");
window.document.ondragstart = new Function("return false");


function toggle( targetId ){
{target = document.all( targetId );
if (target.style.display == "none")
{
target.style.display = "";
} else {
target.style.display = "none";
  }
 }
}
</SCRIPT>
      <table width=130 cellpadding=0 cellspacing="0" border="1" bordercolorlight="#3399FF" bordercolordark="#000000">
          <tr>
            <td onMouseOver="this.style.backgroundColor='#808080';" onMouseOut="this.style.backgroundColor='black';"><center><a onMouseOver="return doScrollerIE('up','s1',10)" onMouseOut="clearInterval(sRepeat)" href="http://sploutchsploutch.free.fr" target="_blank">Monter<img src="http://img10.xooimage.com/files/c/e/0/msg_savebox-129186.gif" border=0 width="130" height="26"><br></a></center></td>
          </tr>
          <tr>
            <td>
              <div id=s1 class=sc1 style="width: 130; height: 100; overflow: hidden;">
             <a href="http://sploutchsploutch.free.fr" target="_blank"><font size="2">Acceuil</font></a><br>
                <a href="http://sploutchsploutch.free.fr/Contact" target="_blank"><font size="2">Contact</font></a><br>
                <a href="http://sploutchsploutch.free.fr/Chater.html" target="_blank"><font size="2">T'chat</font></a><br>
                <a href="http://sploutchsploutch.free.fr/Partenariat.html" target="_blank"><font size="2">Liens</font></a><br>
                <a href="http://sploutchsploutch.free.fr/météo.html" target="_blank"><font size="2">Météo</font></a><br>
                <a href="http://sploutchsploutch.free.fr/smileys.html" target="_blank"><font size="2">Smileys</font></a><br>
            <a href="http://sploutchsploutch.free.fr/FontsEcrans.html" target="_blank"><font size="2">Fonds écran</font></a><br>
                <a href="http://sploutchsploutch.free.fr/Pagejeux.html" target="_blank"><font size="2">Jeux flash</font></a><br>
                <a href="http://www.google.com/custom?domains=sploutchsploutch.free.fr&q=&sa=Rechercher&sitesearch=&client=pub-8556977678328932&forid=1&ie=ISO-8859-1&oe=ISO-8859-1&cof=GALT%3A%23CC0000%3BGL%3A1%3BDIV%3A%230066CC%3BVLC%3A3D81EE%3BAH%3Acenter%3BBGC%3A000000%3BLBGC%3A006699%3BALC%3A3D81EE%3BLC%3A3D81EE%3BT%3AFFFFFF%3BGFNT%3A2BA94F%3BGIMP%3A2BA94F%3BLH%3A60%3BLW%3A90%3BL%3Ahttp%3A%2F%2Fimg7.xooimage.com%2Ffiles%2Ff%2Fo%2Fforum-du-tout-gratuit--d3fad.gif%3BS%3Ahttp%3A%2F%2Fsploutchsploutch.free.fr%2F%3BLP%3A1%3BFORID%3A1&hl=fr" target="_blank"><font size="2">Recherche Google</font></a><br>
                <a href="http://sploutchsploutch.free.fr/UploaderImages" target="_blank"><font size="2">Uploader Images</font></a><br>
                <a href="http://www.ctrouve.com/" target="_blank"><font size="2">Uploader Vidéos</font></a><br>
                <a href="http://upload.is.free.fr/upload.php" target="_blank"><font size="2">Uploader Fichiers</font></a><br>
                <a href="http://sploutchsploutch.free.fr/phpBB2/privmsg.php?folder=inbox" target="_blank"><font size="2">Voir MP</font></a><br>
              </div>
            </td>
          </tr>
          <tr>
            <td onMouseOver="this.style.backgroundColor  = '#808080';" onMouseOut="this.style.backgroundColor = 'black';"><center><a onMouseOver="return doScrollerIE('down','s1',10)" onMouseOut="clearInterval(sRepeat)" href="http://sploutchsploutch.free.fr" target="_blank"><img src="http://img8.xooimage.com/files/f/4/0/msg_savebox-129183.gif" border=0 width="130" height="26"><br>Descendre</a></center></td>
          </tr>
        </table>



Ajoutez ensuite le module dans une page.(celle principale en général)


    Sauvergarder et fermé



-Modifiez bien sur les 2 images que j'ai mis ainsi que les liens.

-Vous pouvez modifier avec quelques connaissances html, couleur, taille, style d'écriture de la police.

-Vous pouvez changer les couleurs la ou il y à inscrit "Monter" et/ou " Descendre " qui est noir et passe au gris quand la souris passe dessus.

-Le fond est transparent, ce qui fait qu'il s'intègre à votre thème.
Il en est de même pour la couleur des lien.


Fin du tuto
By Sploutch ©


_______________________
1 tour pour la forme.1 tour pour l'esprit.

| Le site pour les Filles | Me Soutenir | Smileys Fun | Mes Tutoriels | Mon formulaire D'aide | No Support MP |


Last edited by Sploutch on Sun 16 Feb 2014 - 21:12; edited 6 times in total
Forum
Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Mon 14 May 2007 - 13:14    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

bonjour
bon tuto c'est assez réussi je trouve
on a une capacité illimité pour mettre les liens???
on peut en mettre autant qu'on veut
_______________________


Forum
Author Message
Sploutch
Membre


Offline
Membre

Joined: 02 Jan 2006
Posts: 584
Niveau:
Point(s): 632
Moyenne: 1.08
Masculin

PostPosted: Mon 14 May 2007 - 13:16    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

Merci Themalin,

Oui, oui tu en mets autant que tu veux !
Juste que cela prendra plus de temps pour accéder a ceux qui sont a la fin c'est tout 8)

_______________________
1 tour pour la forme.1 tour pour l'esprit.

| Le site pour les Filles | Me Soutenir | Smileys Fun | Mes Tutoriels | Mon formulaire D'aide | No Support MP |


Forum
Author Message
Twilight


Offline
Guest




PostPosted: Wed 23 Apr 2008 - 22:40    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

Bonjour, je n'arrive pas à le mettre à droite du bloc d'envoie de message, comme sur l'image de l'exemple, comment faut-il faire ?

Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Thu 24 Apr 2008 - 12:23    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

bonjour

tu parles de quelle image exactement
_______________________


Forum
Author Message
Twilight


Offline
Guest




PostPosted: Thu 24 Apr 2008 - 14:13    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

Celle çi

==> http://img.xooimage.com/files2/0/8/6/1-129259.jpg


Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Fri 25 Apr 2008 - 14:34    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

dans ton template posting body cherches


 
Code: Sélectionner - Agrandir
<table width="100%" border="0" cellspacing="0" cellpadding="1">
          <tr>
            <td><span class="gen"><b>{L_MESSAGE_BODY}</b></span> </td>
          </tr>
          <tr>  
mets le code après


 
Code: Sélectionner - Agrandir
 <td><span class="gen"><b>{L_MESSAGE_BODY}</b></span> </td> 

_______________________


Forum
Author Message
Sploutch
Membre


Offline
Membre

Joined: 02 Jan 2006
Posts: 584
Niveau:
Point(s): 632
Moyenne: 1.08
Masculin

PostPosted: Tue 29 Apr 2008 - 19:18    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

Bonjour,
pourras-tu 18, bis faire une capture d'écran de façon à voir ce que cela donne s'il te plaît.
Merci d'avance.
_______________________
1 tour pour la forme.1 tour pour l'esprit.

| Le site pour les Filles | Me Soutenir | Smileys Fun | Mes Tutoriels | Mon formulaire D'aide | No Support MP |


Forum
Author Message
illusion


Offline
Guest




PostPosted: Tue 20 May 2008 - 15:00    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

Bonjour,

merci Sploutch pour ce tuto Very Happy

mais, j'ai un soucie, le "scrolling" ne fonctionne pas Razz

voilà mon script:



Code: Sélectionner - Agrandir

<script>
    var sRepeat=null;
    function doScrollerIE(dir, src, amount) {   
    if (amount==null) {
    amount=10
    }   
    if (dir=="up") {
    document.all[src].scrollTop-=amount
    }   else {
    document.all[src].scrollTop+=amount
    }   if (sRepeat==null) {
    sRepeat = setInterval("doScrollerIE('" + dir + "','" + src + "'," + amount + ")",100)}   return false
    }
    window.document.onmouseout = new Function("clearInterval(sRepeat);sRepeat=null");
    window.document.ondragstart = new Function("return false");


    function toggle( targetId ){
    {target = document.all( targetId );
    if (target.style.display == "none")
    {
    target.style.display = "";
    } else {
    target.style.display = "none";
      }
     }
    }
    </script>
          <table width="130" cellspacing="0" cellpadding="0" border="1" bordercolordark="#CC9933" bordercolorlight="#3399FF">
              <tbody><tr>
                <td onmouseout="function onmouseout(event) {
    this.style.backgroundColor = "black";
}" onmouseover="function onmouseover(event) {
    this.style.backgroundColor = "#FFCC66";
}"><center><a target="_blank" href="http://ageofmagic.xooit.com/portal.php" onmouseout="function onmouseout(event) {
    clearInterval(sRepeat);
}" onmouseover="function onmouseover(event) {
    return doScrollerIE("up", "s1", 10);
}">Monter<img width="130" height="40" border="0" src="http://steven.feerik.com/images/19-05-08.jpg" /><br /></a></center></td>
              </tr>
              <tr>
                <td>
                  <div style="overflow: hidden; width: 130px; height: 100px;" class="sc1" id="s1">
                 <a target="_blank" href="http://ageofmagic.xooit.com/index.php"><font size="2">Forum</font></a><br />
                    <a target="_blank" href="http://iotup.olympe-network.com/index.php?pub=0"><font size="2">La carte d'AOM</font></a><br />
                    <a target="_blank" href="http://steven.feerik.com/"><font size="2">Le Blog de Steven</font></a><br />
                    <a target="_blank" href="http://www.ageofmagic.net/forum/"><font size="2">Forum Officiel d'AOM</font></a><br />
                    <a target="_blank" href="http://www.ageofmagic.net/"><font size="2">Age Of Magic</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/portal.php?pid=6"><font size="2">Les monstre en image d'AOM</font></a><br />
                <a target="_blank" href="http://ageofmagic.xooit.com/portal.php?pid=4"><font size="2">Les Sorts en image d'AOM</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/portal.php?pid=5"><font size="2">Les Familiers en image d'AOM</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/f138-Sommaire-des-Quetes.htm"><font size="2">Sommaire des Quêtes</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/f25-Inventaire.htm"><font size="2">L'Inventaire</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/f26-Carte.htm"><font size="2">La Carte par Zone</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/login.php?logout=true&rci=c80a3a2f0eed68d4c609708a878ca01d"><font size="2">Se Connecter/ Déconnecter</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/profile.php?mode=register"><font size="2">S'inscrire</font></a><br />
                  </div>
                </td>
              </tr>
              <tr>
                <td onmouseout="function onmouseout(event) {
    this.style.backgroundColor = "black";
}" onmouseover="function onmouseover(event) {
    this.style.backgroundColor = "#FFCC66";
}"><center><a target="_blank" href="http://ageofmagic.xooit.com/portal.php" onmouseout="function onmouseout(event) {
    clearInterval(sRepeat);
}" onmouseover="function onmouseover(event) {
    return doScrollerIE("down", "s1", 10);
}"><img width="130" height="40" border="0" src="http://steven.feerik.com/images/19-05-08.jpg" /><br />Descendre</a></center></td>
              </tr>
            </tbody></table>
</span>
</td>
</tr>
</table> 



tu saurais me dire ce qui ne va pas s'il te plait? Embarassed


Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Tue 20 May 2008 - 15:03    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

bonjour

est ce que pour tes autres membres ça marche ou juste toi??
_______________________


Forum
Author Message
illusion


Offline
Guest




PostPosted: Tue 20 May 2008 - 15:05    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

heu ben , il n'est visible que pour l'admin ( moi ) car je voulais le tester avant de remplacer mon ancien menu

Edit : là, je l'ai mis visible pour tous pour essayer aussi, et ça fonctionne pas quand même Sad
Edit 1: il est tout en bas du portail: ici


Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Tue 20 May 2008 - 15:19    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

tu as essayé de mettre au lieu de ça

Code: Sélectionner - Agrandir
<a target="_blank" href="http://ageofmagic.xooit.com/index.php"><font size="2">Forum</font></a><br />
                    <a target="_blank" href="http://iotup.olympe-network.com/index.php?pub=0"><font size="2">La carte d'AOM</font></a><br />
                    <a target="_blank" href="http://steven.feerik.com/"><font size="2">Le Blog de Steven</font></a><br />
                    <a target="_blank" href="http://www.ageofmagic.net/forum/"><font size="2">Forum Officiel d'AOM</font></a><br />
                    <a target="_blank" href="http://www.ageofmagic.net/"><font size="2">Age Of Magic</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/portal.php?pid=6"><font size="2">Les monstre en image d'AOM</font></a><br />
                <a target="_blank" href="http://ageofmagic.xooit.com/portal.php?pid=4"><font size="2">Les Sorts en image d'AOM</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/portal.php?pid=5"><font size="2">Les Familiers en image d'AOM</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/f138-Sommaire-des-Quetes.htm"><font size="2">Sommaire des Quêtes</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/f25-Inventaire.htm"><font size="2">L'Inventaire</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/f26-Carte.htm"><font size="2">La Carte par Zone</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/login.php?logout=true&rci=c80a3a2f0eed68d4c609708a878ca01d"><font size="2">Se Connecter/ Déconnecter</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/profile.php?mode=register"><font size="2">S'inscrire</font></a><br />



ça

Code: Sélectionner - Agrandir

<marquee direction="left">
<a target="_blank" href="http://ageofmagic.xooit.com/index.php"><font size="2">Forum</font></a><br />
                    <a target="_blank" href="http://iotup.olympe-network.com/index.php?pub=0"><font size="2">La carte d'AOM</font></a><br />
                    <a target="_blank" href="http://steven.feerik.com/"><font size="2">Le Blog de Steven</font></a><br />
                    <a target="_blank" href="http://www.ageofmagic.net/forum/"><font size="2">Forum Officiel d'AOM</font></a><br />
                    <a target="_blank" href="http://www.ageofmagic.net/"><font size="2">Age Of Magic</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/portal.php?pid=6"><font size="2">Les monstre en image d'AOM</font></a><br />
                <a target="_blank" href="http://ageofmagic.xooit.com/portal.php?pid=4"><font size="2">Les Sorts en image d'AOM</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/portal.php?pid=5"><font size="2">Les Familiers en image d'AOM</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/f138-Sommaire-des-Quetes.htm"><font size="2">Sommaire des Quêtes</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/f25-Inventaire.htm"><font size="2">L'Inventaire</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/f26-Carte.htm"><font size="2">La Carte par Zone</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/login.php?logout=true&rci=c80a3a2f0eed68d4c609708a878ca01d"><font size="2">Se Connecter/ Déconnecter</font></a><br />
                    <a target="_blank" href="http://ageofmagic.xooit.com/profile.php?mode=register"><font size="2">S'inscrire</font></a><br /></marquee>

_______________________


Forum
Author Message
illusion


Offline
Guest




PostPosted: Tue 20 May 2008 - 15:29    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

je viens d'essayer lol, ça défile bien de droite a gauche^^

Author Message
Sploutch
Membre


Offline
Membre

Joined: 02 Jan 2006
Posts: 584
Niveau:
Point(s): 632
Moyenne: 1.08
Masculin

PostPosted: Thu 22 May 2008 - 19:20    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

illusion wrote:

Edit 1: il est tout en bas du portail: ici

Je suis allé sur ton portail, mais je n'ai rien vu ?!
Sinon, tout fonctionne, sauf le scrolling ?
Sur quoi place tu ta souris, pour le faire ?
_______________________
1 tour pour la forme.1 tour pour l'esprit.

| Le site pour les Filles | Me Soutenir | Smileys Fun | Mes Tutoriels | Mon formulaire D'aide | No Support MP |


Forum
Author Message
illusion


Offline
Guest




PostPosted: Fri 23 May 2008 - 01:03    Post subject: [Tuto] Un bloc avec Menu Scroll Reply with quote

je l'ai enlever sploutch du coup, c'est pour ça que tu ne le voie pas

tu peux le voir ici si tu veux

les liens fonctionnent, mais c'est juste le scrolling qui ne fonctionne pas en fait


Author Message
Contenu Sponsorisé





PostPosted: Today at 20:45    Post subject: [Tuto] Un bloc avec Menu Scroll

Display posts from previous:   
Reply to topic Page 1 of 4 Goto page: 1, 2, 3, 4  >




Portal | Index | Administration Panel | Create a forum | Free support forum | Free forums directory | Report a violation | Conditions générales d'utilisation
Propulsé par p h p B B © 2016 p h p B B Group |
 
© 2003-2013 Xooit.com - Contact - Mentions légales - CGU - Charte - CNIL : 1381401