Xooit.com

Aide et Support

[XOU-IT]

All times are GMT + 1 Hour


[Tuto] Effets rideaux
Goto page: 1, 2, 3, 4, 5  >
 
Post new topic   Reply to topic Goto page: 1, 2, 3, 4, 5  >
 
Author Message
Tex-f7
PostPosted: Sat 9 Aug 2008 - 19:05    Post subject: [Tuto] Effets rideaux Reply with quote

Tutoriel - Effets rideaux
Un rideau qui s'ouvre lorsqu'on arrive sur l'index du forum



  • Date de dernière mise à jour: 09/08/2008
  • Mots Clés: rideaux, rideau, effet, ouverture

  • Niveau : Facile / Moyen / Difficile
  • Nombre de thèmes compatibles : 100%
  • Test effectué sur : Les forums Xooit.com
  • Exemples : http://gtabomb.xooit.fr/ & http://texf7.xoo.it/

  • Pré-requis: Accès au panneau d'admin

  • Auteur / VersionModifications apportées
    clad77 (0.5) Ebauche
    Tex-f7 (1.0) Création du tutorial et tests associés






  1. Overall Header

    Quote:

    Choisisser le template overall_header.tpl, modifier-le comme suit.


    Quote:
    Chercher </head> et coller juste avant le code suivant (voir l'image) :


    Code: Sélectionner - Agrandir

    <!-- debut tuto rideau 1 -->
    <style><!--
    .intro{
    position:absolute;
    left:0;
    top:0;
    layer-background-color:red;
    background-color:red;
    border:0.1px solid red;
    z-index:9;
    }
    --></style>
    <!-- Fin tuto rideau 1 -->


  2. Index Body

    Quote:

    Mettez tout à la fin du template index_body.tpl :


    Quote:
    Code: Sélectionner - Agrandir

    <div id="i1" class="intro"></div><div id="i2" class="intro"></div>
    <script language="JavaScript1.2">

    /*
    Ce script et d'autres sont sur le code java GRATUIT 
    LE CODE JAVA - [url=http://www.lecodejava.com]www.lecodejava.com[/url]
    */

    var ns4=document.layers?1:0
    var ie4=document.all?1:0
    var ns6=document.getElementById&&!document.all?1:0

    var speed=20
    var temp=new Array()
    var temp2=new Array()
    if (ns4){
    for (i=1;i<=2;i++){
    temp[i]=eval("document.i"+i+".clip")
    temp2[i]=eval("document.i"+i)
    temp[i].width=window.innerWidth/2
    temp[i].height=window.innerHeight
    temp2[i].left=(i-1)*temp[i].width
    }
    }
    else if (ie4||ns6){
    var clipright=ns6?window.innerWidth/2*0.98:document.body.clientWidth/2,clipleft=0
    for (i=1;i<=2;i++){
    temp[i]=ns6?document.getElementById("i"+i).style:eval("document.all.i"+i+".style")
    temp[i].width=ns6?window.innerWidth/2*0.98:document.body.clientWidth/2
    temp[i].height=ns6?window.innerHeight-1: document.body.offsetHeight
    temp[i].left=(i-1)*parseInt(temp[i].width)
    }
    }


    function openit(){
    window.scrollTo(0,0)
    if (ns4){
    temp[1].right-=speed
    temp[2].left+=speed
    if (temp[2].left>window.innerWidth/2)
    clearInterval(stopit)
    }
    else if (ie4||ns6){
    clipright-=speed
    temp[1].clip="rect(0 "+clipright+" auto 0)"
    clipleft+=speed
    temp[2].clip="rect(0 auto auto "+clipleft+")"
    if (clipright<=0){
    clearInterval(stopit)
    if (ns6){
    temp[1].display="none"
    temp[2].display="none"
    }
    }
    }
    }
    function gogo(){
    stopit=setInterval("openit()",100)
    }
    gogo()
    </script>





    La vitesse d'ouverture est modifiable. Il suffit de changer le var speed=20
    Moi j'ai mis =100, parce que sinon c'est trop lent :]




N'hésitez pas à regarder les exemples pour voir ce que ça fait exactement.




_______________________
Tex-f7 - Administrateur du forum de support Xooit.com
Ne m'envoyez pas de MP pour les demandes d'aides car je n'y répond pas, sauf si c'est moi qui vous demande de le faire.


Last edited by Tex-f7 on Mon 11 Aug 2008 - 00:22; edited 1 time in total
Administrateur
Administrateur

Offline

Joined: 17 Jun 2004
Posts: 7,055
Niveau:
Point(s): 7,121
Moyenne: 1.01
Trophées: Trophée Equipe : Trophée décerné aux membres de l'équipe Xooit.
Firefox 3 Windows Vista Masculin Taureau (20avr-20mai) 龍 Dragon

Visit poster’s website GTalk/Jabber
Arlem2
PostPosted: Sun 10 Aug 2008 - 00:06    Post subject: [Tuto] Effets rideaux Reply with quote

J'crois qu'il est même trop rapide sur ton forum je le vois pas ... =/
_______________________


Membre
Membre

Offline

Joined: 26 Jun 2006
Posts: 6,236
Point(s): 4,102
Moyenne: 0.66
Trophées: Trophée Pikachu : Récompense le plus grand fan de Pokémon.
Firefox 3 Linux Masculin Gémeaux (21mai-20juin) 猴 Singe

Visit poster’s website
Yskander
PostPosted: Sun 10 Aug 2008 - 00:28    Post subject: [Tuto] Effets rideaux Reply with quote

Il faut aller sur le forum
Ca fait bien je trouve
_______________________





Membre
Membre

Offline

Joined: 26 Jan 2008
Posts: 6,511
Point(s): 4,414
Moyenne: 0.68
Trophées: Trophée Lorie : Ce trophée n'est décerné qu'à la Lorie du forum.
Firefox 3 Windows Vista Balance (23sep-22oct) 猴 Singe

Visit poster’s website GTalk/Jabber
Arlem2
PostPosted: Sun 10 Aug 2008 - 00:33    Post subject: [Tuto] Effets rideaux Reply with quote

*Boulet*

Mea Culpa.

En tout cas, celui-là est complet, et effectivement ça peut rajouter un effet sympa...
_______________________


Membre
Membre

Offline

Joined: 26 Jun 2006
Posts: 6,236
Point(s): 4,102
Moyenne: 0.66
Trophées: Trophée Pikachu : Récompense le plus grand fan de Pokémon.
Firefox 3 Linux Masculin Gémeaux (21mai-20juin) 猴 Singe

Visit poster’s website
Yskander
PostPosted: Sun 10 Aug 2008 - 00:37    Post subject: [Tuto] Effets rideaux Reply with quote

"Errare humanum est"
Je le tenterai bien mais j'ai peur que mes membres qui disposent d'un débit assez bas ne soient indisposés par ce script de plus
Je vais attendre de voir un peu ce que les testeurs en pensent
En tout cas avec les screen c'est simple à appliquer... cela devrait être obligatoire dans les tutos.

_______________________





Membre
Membre

Offline

Joined: 26 Jan 2008
Posts: 6,511
Point(s): 4,414
Moyenne: 0.68
Trophées: Trophée Lorie : Ce trophée n'est décerné qu'à la Lorie du forum.
Firefox 3 Windows Vista Balance (23sep-22oct) 猴 Singe

Visit poster’s website GTalk/Jabber
themalin
PostPosted: Sun 10 Aug 2008 - 10:36    Post subject: [Tuto] Effets rideaux Reply with quote

bonjour

un peu rouge mais c'est pas mal
_______________________


Membre
Membre

Online

Joined: 19 Apr 2006
Posts: 42,987
Point(s): 42,476
Moyenne: 0.99
Trophées: Trophée Bleu : Meilleur Posteur du forum d'entraide.
Firefox 3 Windows

Visit poster’s website
Arlem2
PostPosted: Sun 10 Aug 2008 - 11:47    Post subject: [Tuto] Effets rideaux Reply with quote

La couleur peut-être changée Smile
_______________________


Membre
Membre

Offline

Joined: 26 Jun 2006
Posts: 6,236
Point(s): 4,102
Moyenne: 0.66
Trophées: Trophée Pikachu : Récompense le plus grand fan de Pokémon.
Firefox 3 Linux Masculin Gémeaux (21mai-20juin) 猴 Singe

Visit poster’s website
themalin
PostPosted: Sun 10 Aug 2008 - 11:47    Post subject: [Tuto] Effets rideaux Reply with quote

oui je sais ça
_______________________


Membre
Membre

Online

Joined: 19 Apr 2006
Posts: 42,987
Point(s): 42,476
Moyenne: 0.99
Trophées: Trophée Bleu : Meilleur Posteur du forum d'entraide.
Firefox 3 Windows

Visit poster’s website
greenmantle
PostPosted: Sun 10 Aug 2008 - 12:57    Post subject: [Tuto] Effets rideaux Reply with quote

Super ça moyen de mettre une image qui s'ouvrirait façon rideau, style le logo du fofo?

Membre
Membre

Offline

Joined: 10 Aug 2008
Posts: 10
Point(s): 6
Moyenne: 0.60
Firefox Windows Vista Masculin Sagittaire (22nov-21déc) 鼠 Rat

Visit poster’s website
Arlem2
PostPosted: Sun 10 Aug 2008 - 13:48    Post subject: [Tuto] Effets rideaux Reply with quote

Salut,

Mets ce code là dans le Overall_header.Tpl :
Code: Sélectionner - Agrandir
    <!-- debut tuto rideau 1 -->
    <style><!--
    .intro{
    position:absolute;
    left:0;
    top:0;
    layer-background-image: url("adresse de l'image");
    background-image: url("adresse de l'image");
    border:0.1px solid red;
    z-index:9;
    }
    --></style>
    <!-- Fin tuto rideau 1 -->


Testé sous Subsilver.
_______________________


Membre
Membre

Offline

Joined: 26 Jun 2006
Posts: 6,236
Point(s): 4,102
Moyenne: 0.66
Trophées: Trophée Pikachu : Récompense le plus grand fan de Pokémon.
Firefox 3 Linux Masculin Gémeaux (21mai-20juin) 猴 Singe

Visit poster’s website
greenmantle
PostPosted: Sun 10 Aug 2008 - 14:55    Post subject: [Tuto] Effets rideaux Reply with quote

Razz super je redimensionne un peu l'image et je tiens au jus

Membre
Membre

Offline

Joined: 10 Aug 2008
Posts: 10
Point(s): 6
Moyenne: 0.60
Firefox Windows Vista Masculin Sagittaire (22nov-21déc) 鼠 Rat

Visit poster’s website
Arlem2
PostPosted: Sun 10 Aug 2008 - 14:56    Post subject: [Tuto] Effets rideaux Reply with quote

Oui, l'image n'est pas redimensionné, cela risque de poser problème pour les utilisateurs qui n'ont pas la même taille d'écran =/
_______________________


Membre
Membre

Offline

Joined: 26 Jun 2006
Posts: 6,236
Point(s): 4,102
Moyenne: 0.66
Trophées: Trophée Pikachu : Récompense le plus grand fan de Pokémon.
Firefox 3 Linux Masculin Gémeaux (21mai-20juin) 猴 Singe

Visit poster’s website
greenmantle
PostPosted: Sun 10 Aug 2008 - 17:45    Post subject: [Tuto] Effets rideaux Reply with quote

Bon merci à tous, ça marche super, j'ai réglé style écran 17 pouces, et la vitesses sur 25 vue que c'est le logo de l' Association au moins on a le temps de bien le voir Wink

Encore un gros Merci


Membre
Membre

Offline

Joined: 10 Aug 2008
Posts: 10
Point(s): 6
Moyenne: 0.60
Firefox Windows Vista Masculin Sagittaire (22nov-21déc) 鼠 Rat

Visit poster’s website
Arlem2
PostPosted: Sun 10 Aug 2008 - 17:48    Post subject: [Tuto] Effets rideaux Reply with quote

Effectivement ça rend bien Wink
_______________________


Membre
Membre

Offline

Joined: 26 Jun 2006
Posts: 6,236
Point(s): 4,102
Moyenne: 0.66
Trophées: Trophée Pikachu : Récompense le plus grand fan de Pokémon.
Firefox 3 Linux Masculin Gémeaux (21mai-20juin) 猴 Singe

Visit poster’s website
clad77
PostPosted: Sun 10 Aug 2008 - 18:58    Post subject: [Tuto] Effets rideaux Reply with quote

Merci Tex-f7  Very Happy
_______________________
>>>FORUM DETENTE<<<


Membre
Membre

Offline

Joined: 15 Jun 2008
Posts: 94
Point(s): 77
Moyenne: 0.82

Visit poster’s website
Display posts from previous:   
Post new topic   Reply to topic Goto page: 1, 2, 3, 4, 5  >
Page 1 of 5

All times are GMT + 1 Hour


Jump to:  


Top Forums Xooit