CodeS-SourceS est hébergé par Frontier.fr

Ce site au démarrage

begin process at 2010 02 10 11:45:34

Accueil Codes Tutoriels Forum Livres Emploi Services Connexion

Trouver un code source :

dans

[ Dernières recherches ]

Accueil >

Navigation

> ROLLOVER DE NAVIGATION EN IMAGES QUI PERMET DE SE SITUER DANS UN SITE

ROLLOVER DE NAVIGATION EN IMAGES QUI PERMET DE SE SITUER DANS UN SITE

Information sur la source

Note :

9,50 / 10

Catégorie :Navigation Niveau :Initié Date de création :20/02/2004 Date de mise à jour :30/07/2004 05:02:28 Vu / téléchargé :14 305 / 1 152

Auteur : cartoongraphist

Ecrire un message privé

Site perso

Commentaire sur cette source (20)

Ajouter un commentaire et/ou une note

Description

Cliquez pour voir la capture en taille normale

Ce script permet d'avoir un menu qui utilise les rollovers en image
mais il a la particularité  de laisser la derniere image sur laquelle
on a cliqué en l'etat lorsque l'on change de page, ce qui permet
à l'internaute de savoir ou il est situé dans le site.

Version 0.5 (Anciennes versions fournies):
Possede un encart Utilisateur pour parametrer la presentation
et qui evite de faire des changements dans le code et de générer
d'eventuelles erreurs ;-)

tests sur:
PC : IE6:ok / Mozilla-FireFox 0.8:ok
     Mozilla 5.0:ok  / Opera:ok

Mac (Os9): Netscape:ok / IE:ok
Mac (OsX) : IE(OsX):ok / Safari:ok

Le .zip contient les pages HTML d'exemples , le script en .js , l'image
de presentation et les anciennes versions du script.

Source

/**************************************************
---------------------------------------------------
ROLLOVER_DE_NAVIGATION : V 0.5 |
|
PC : IE6:ok / Mozilla-FireFox 0.8:ok |
Mozilla 5.0:ok / Opera:ok |
|
Mac (Os9): Netscape:ok / IE:ok |
Mac (OsX) : IE(OsX):ok / Safari:ok |
|
Par Eric Delapierre 20/02/2004 MAJ:23/02/2004 |
magoo@robot-droid.com |
---------------------------------------------------
Cette version a été completement retravaillée.
Elle permet de ne plus toucher au code. Elle
detecte automatiquement le nombre de liens ajoutés
et fabrique aussitôt les variables necessaires au
fonctionnement du script pour nommer les images et
les variables qui seront passées par url.
Les pages HTML qui integreront ce script
devront placer le fichier rollover_de_navigation_v0-5.js
et la fonction d'affichage affiche().
Pour commencer il suffit de placer les scripts
suivants :
1-
<script src="rollover_de_navigation_v0-5.js"
type="text/javascript"></script>
entre les balises <HEAD> </HEAD> de chaque page.
2-
<SCRIPT LANGUAGE = "JavaScript">
<!-- Cacher le script aux anciens navigateurs
affiche();
// Cesser de cacher le script -->
</SCRIPT>
Entre les balises <BODY> </BODY> de chaque page
à l'endroit ou l'on veut que le menu s'affiche.
Vous pouvez avec l'encart PARAMETRAGE UTILISATEUR
entrer le nom de chaque page HTML qui utilisera ce
script et regler la presentation des images en
ligne ou en colonne.
En outre il est possible de placer un espace entre
chaque image et de regler la taille de cet espace.
---------------------------------------------------
-Script complet, fichiers d'accompagnement et |
archives des anciennes versions telechargeables |
sur http://www.javascriptfr.com |
------- |
Si vous envisagez de vous servir de ce script ou |
de le transformer, soyez sympa, laissez cet encart |
ça me fera enooormement plaisir ;-) |
---------------------------------------------------
***************************************************/
//************************ PARAMETRAGES UTILISATEUR **************************************+
//-----------------------------------------------------------------------------------------//+
// Entrer ici le nom de chaque page HTML qui utilisera ce script en les separant d'un espace +
// et sans mettre l'extension .html +
// On peut mettre autant de liens que l'on desire :) +
//-----------------------------------------------------------------------------------------//+
tous_les_liens = "liens association accueil";
var images_en_ligne = "oui"; /* mettre oui ou non pour avoir un retour charriot.
si oui les images sont presentées en ligne
si non les images sont presentées en colonne */
var espace_entre_image="non"; /* mettre oui ou non pour avoir un espace entre les images.*/
var taille_de_l_espace = 1; /* mettez ici un chiffre qui reglera la taille de l'espace
entre les images*/
//-----------------------------------------------------------------------------------------//+
// Vous n'avez plus à vous occuper du reste ;-) pensez juste a lire l'encart Ajout V 0.4 //+
// situé plus bas pour la nomenclature de vos images. //+
//-----------------------------------------------------------------------------------------//+
//********************** FIN DE PARAMETRAGES UTILISATEUR ******************************+
//-------------------------------------------------------------------
/* On veut recuperer le parametre de l'url "www.mondomaine.com/index.html?lien=lien1 */
var url=location.search; //url="?lien=lien1"
var params = url.substring(1); // params = "lien=lien1" <-- sans le ?
var tab = params.split("="); /*tab est un tableau généré par split().
par ex :On obtient tab[0] = "lien" et tab[1]="lien1" */
lien=tab[1]; // on donne à la variable "lien" la valeur de tab[1]
/* search -propriété de l'objet location. Permet de connaitre les paramêtres envoyé dans une url
substring - méthode de l'objet String. Extrait une sous-chaine de la chaîne de caractères,
à partir du 1er indice indiqué.
split - méthode de l'objet String.Découpe une chaîne de caractères suivant le séparateur indiqué
en argument. Retourne un tableau contenant les sous-chaînes résultantes.*/
//--------------------------------------------------------------------
// *** Ajout V 0.4 ***
//-----------------------------------------------------------------
/* ce script automatise la nomenclature des liens et des images,
Ce qui évite des manipulations du script et des sources d'erreurs.
Il suffit de mettre dans la variable tous_les_liens (plus haut) le nom de
chaque page HTML du site, séparé par un espace.
Le script automatisera les nomenclatures qui servent par la suite.
*** IMPORTANT ***
Les images doivent IMPERATIVEMENT porter leur nom sous cette forme:
lien1B.gif et lien1R.gif --> pour l'image bleu et l'image rouge du premier lien
lien2B.gif et lien2R.gif --> pour l'image bleu et l'image rouge du second lien
lien3B.gif et lien3R.gif --> pour l'image bleu et l'image rouge du troisieme lien
etc...
Ces images doivent être stockées dans un repertoire nommé "images" */
var rep = "images/"; // on defini un repertoire pour les images
function survol(Objet,Fichier) {
if (!document.images) {} /*permet de ne rien faire, pour les navigateurs ne supportant
pas les objets images.*/
document.images[Objet].src = rep + Fichier; /*document.images est la collection des images
de la page*/
}
var tab_url = tous_les_liens.split(" "); //on recupere dans un tableau chaque chaine
//separé par un espace
function affiche()
{ // debut fonction
for (i=0;i<tab_url.length;i++)
{ // debut boucle for1
for(i = 0 ; i < tab_url.length ; i++) //on parcourt le tableau de chaine en chaine jusqu'a la fin
{ //debut boucle for2
tab_image_bleu=new Array; // declaration de nouveaux tableaux
tab_lien=new Array;
tab_image_rouge=new Array;
tab_image=new Array;
tab_image_def=new Array;
tab_image_def2=new Array;
img=new Array;
tab_image_bleu[i] ="lien"+(i+1)+"B.gif"; // On ajoute a l'element la nomenclature et le numero
tab_image_rouge[i] ="lien"+(i+1)+"R.gif"; // de l'image
tab_lien[i] =tab_url[i]+".html?lien=lien"+(i+1); // On ajoute le couple variable numeroté qui est passé ds l'url
tab_image[i] ="image"+(i+1); // on numerote l'ojet image
tab_image_def="images/"+tab_image_bleu[i]; // on numerote l'image par defaut
tab_image_def2="images/"+tab_image_rouge[i];
if (tab[1]=="lien"+(i+1)) // compare la valeur passée en url
{
/* met tous les boutons en rouge */
img =new Array(tab_image_rouge[i],tab_image_rouge[i],tab_image_def2,tab_image[i]);
}
else {
/* met tous les boutons par defaut en rollover classique*/
img =new Array(tab_image_rouge[i],tab_image_bleu[i],tab_image_def,tab_image[i]);
}
//-----------------------------------------------------------------------
// *** Ajout V 0.5 ***
//-----------------------------------------------------------------------
// gere les retours charriot ou les espaces entre chaque image.
if (images_en_ligne =="oui") // en ligne
{
// gere l'espace entre les images
if (espace_entre_image=="oui") // si espace on fait une boucle
{
retourcharriot="";
espace1=" "; //  est espace en HTML
espace="";
for (j=0;j< taille_de_l_espace;j++)
{
espace=espace1+espace;
}
}
else // si pas espace on fait pas de boucle
{
espace="";
retourcharriot="";
}
}
else
{ // en colonne
// gere l'espace entre les images
if (espace_entre_image=="oui") // si espace on fait une boucle
{
espace="";
retourcharriot1="<BR>";
retourcharriot="";
for (j=-1;j<taille_de_l_espace ;j++)
{
retourcharriot=retourcharriot1+retourcharriot;
}
}
else // si pas espace on fait pas de boucle
{
retourcharriot="<BR>";
espace="";
}
}
//-----------------------------------------------------------------
document.write('<a href="'+tab_lien[i]+'"'); // affichage des boutons
document.write('onMouseOver="survol(\''+img[3]+'\',\''+img[0]+'\')"');
document.write('onMouseOut="survol(\''+img[3]+'\',\''+img[1]+'\')">');
document.write('<img name=\"'+img[3]+'\" border="0" src="'+img[2]+'"></a>');
document.write (retourcharriot);
document.write (espace);
} // fin boucle for1
} // fin fonction for2
} //fin fonction affiche
//-----------------------------------------------------------------
/* Ne pas oublier de mettre les images dans le repertoire image si on ajoute des liens :)) */

/**************************************************
---------------------------------------------------
ROLLOVER_DE_NAVIGATION : V 0.5                     |
                                                   |
PC : IE6:ok / Mozilla-FireFox 0.8:ok               |
     Mozilla 5.0:ok  / Opera:ok                    |
                                                   |
Mac (Os9): Netscape:ok / IE:ok                     |
Mac (OsX) : IE(OsX):ok / Safari:ok                 |
                                                   |
Par Eric Delapierre 20/02/2004  MAJ:23/02/2004     |
magoo@robot-droid.com                              |
---------------------------------------------------
Cette version a été completement retravaillée.
Elle permet de ne plus toucher au code. Elle
detecte automatiquement le nombre de liens ajoutés
et fabrique aussitôt les variables necessaires au
fonctionnement du script pour nommer les images et
les variables qui seront passées par url.

Les pages HTML qui integreront ce script
devront placer le fichier rollover_de_navigation_v0-5.js
et la fonction d'affichage affiche().
Pour commencer il suffit de placer les scripts
suivants :
1-
<script src="rollover_de_navigation_v0-5.js"
type="text/javascript"></script>

entre les balises <HEAD> </HEAD> de chaque page. 

2-
<SCRIPT LANGUAGE = "JavaScript">
<!-- Cacher le script aux anciens navigateurs
affiche();
// Cesser de cacher le script -->
</SCRIPT>

Entre les balises <BODY> </BODY> de chaque page
à l'endroit ou l'on veut que le menu s'affiche.

Vous pouvez avec l'encart PARAMETRAGE UTILISATEUR
entrer le nom de chaque  page HTML qui utilisera ce 
script et regler la presentation des images en 
ligne ou en colonne.
En outre il est possible de placer un espace entre
chaque image et de regler la taille de cet espace.

---------------------------------------------------
-Script complet, fichiers d'accompagnement et      |
archives des anciennes versions  telechargeables   |
sur http://www.javascriptfr.com                    |
               -------                             |              
Si vous envisagez de vous servir de ce script ou   |
de le transformer, soyez sympa, laissez cet encart |
ça me fera enooormement plaisir ;-)                |
---------------------------------------------------
***************************************************/





//************************   PARAMETRAGES UTILISATEUR  **************************************+
//-----------------------------------------------------------------------------------------//+
// Entrer ici le nom de chaque page HTML qui utilisera ce script en les separant d'un espace +
// et sans mettre l'extension .html                                                          +
// On peut mettre autant de liens que l'on desire :)                                         +
//-----------------------------------------------------------------------------------------//+
                                                                                           
tous_les_liens = "liens association accueil";

var images_en_ligne = "oui"; /* mettre oui ou non pour avoir un retour charriot.
				si oui les images sont presentées en ligne
				si non les images sont presentées en colonne */

var espace_entre_image="non"; /* mettre oui ou non pour avoir un espace entre les images.*/

var taille_de_l_espace = 1; /* mettez ici un chiffre qui reglera la taille de l'espace
                               entre les images*/

//-----------------------------------------------------------------------------------------//+
// Vous n'avez plus à vous occuper du reste ;-) pensez juste a lire l'encart Ajout V 0.4   //+
// situé plus bas pour la nomenclature de vos images.                                      //+
//-----------------------------------------------------------------------------------------//+
//**********************    FIN DE PARAMETRAGES UTILISATEUR    ******************************+













//-------------------------------------------------------------------
/* On veut recuperer le parametre de l'url "www.mondomaine.com/index.html?lien=lien1 */

var url=location.search; //url="?lien=lien1"

var params = url.substring(1); // params = "lien=lien1" <-- sans le ?

var tab = params.split("="); /*tab est un tableau généré par split(). 
                             par ex :On obtient tab[0] = "lien"  et tab[1]="lien1" */
lien=tab[1];                 // on donne à la variable "lien" la valeur de tab[1]

/* search -propriété de l'objet location. Permet de connaitre les paramêtres envoyé dans une url
substring - méthode de l'objet String. Extrait une sous-chaine de la chaîne de caractères, 
à partir du 1er indice indiqué.
split - méthode de l'objet String.Découpe une chaîne de caractères suivant le séparateur indiqué 
en argument. Retourne un tableau contenant les sous-chaînes résultantes.*/
//--------------------------------------------------------------------




//      ***  Ajout V 0.4  ***
//-----------------------------------------------------------------
/* ce script automatise la nomenclature des liens et des images,
Ce qui évite des manipulations du script et des sources d'erreurs.
Il suffit de mettre dans la variable tous_les_liens (plus haut) le nom de 
chaque page HTML du site, séparé par un espace.
Le script automatisera les nomenclatures qui servent par la suite.
*** IMPORTANT ***
Les images doivent IMPERATIVEMENT porter leur nom sous cette forme:
lien1B.gif et lien1R.gif     --> pour l'image bleu et l'image rouge du premier lien
lien2B.gif et lien2R.gif     --> pour l'image bleu et l'image rouge du second lien
lien3B.gif et lien3R.gif     --> pour l'image bleu et l'image rouge du troisieme lien
etc...
Ces images doivent être stockées dans un repertoire nommé "images"                 */


var rep = "images/"; // on defini un repertoire pour les images
function survol(Objet,Fichier) {
   if (!document.images) {}  /*permet de ne rien faire, pour les navigateurs ne supportant 
                             pas les objets images.*/
   document.images[Objet].src = rep + Fichier; /*document.images est la collection des images 
                                               de la page*/
                                }


var tab_url = tous_les_liens.split(" "); //on recupere dans un tableau chaque chaine
                                         //separé par un espace
function affiche()
		{                        // debut fonction
	for (i=0;i<tab_url.length;i++)
			{                // debut boucle for1


for(i = 0 ; i < tab_url.length ; i++)   //on parcourt le tableau de chaine en chaine jusqu'a la fin
	{                               //debut boucle for2
tab_image_bleu=new Array;               // declaration de nouveaux tableaux
tab_lien=new Array;
tab_image_rouge=new Array;
tab_image=new Array;
tab_image_def=new Array;
tab_image_def2=new Array;
img=new Array;

tab_image_bleu[i] ="lien"+(i+1)+"B.gif";      // On ajoute a l'element la nomenclature et le numero
tab_image_rouge[i] ="lien"+(i+1)+"R.gif";     // de l'image
tab_lien[i] =tab_url[i]+".html?lien=lien"+(i+1); // On ajoute le couple variable numeroté qui est passé ds l'url
tab_image[i] ="image"+(i+1);      // on numerote l'ojet image
tab_image_def="images/"+tab_image_bleu[i];      // on numerote l'image par defaut
tab_image_def2="images/"+tab_image_rouge[i];




                                
if (tab[1]=="lien"+(i+1))    // compare la valeur passée en url
        {
        /* met tous les boutons en rouge */
        img =new Array(tab_image_rouge[i],tab_image_rouge[i],tab_image_def2,tab_image[i]);
        }
else    {
        /* met tous les boutons par defaut en rollover classique*/
    	img =new Array(tab_image_rouge[i],tab_image_bleu[i],tab_image_def,tab_image[i]);
        }
//-----------------------------------------------------------------------






//          ***   Ajout V 0.5   ***
//-----------------------------------------------------------------------
// gere les retours charriot ou les espaces entre chaque image.

if (images_en_ligne =="oui")   // en ligne
{
   // gere l'espace entre les images
   if (espace_entre_image=="oui") // si espace  on fait une boucle
       {
       	retourcharriot="";
       	espace1="&nbsp;";           //&nbsp; est  espace en HTML
       	espace="";
       	for (j=0;j< taille_de_l_espace;j++)
            {
            espace=espace1+espace;
            }
        }
   else                           // si pas espace on fait pas de boucle
       {
       espace="";
       retourcharriot="";
       }
}
else 
{                         // en colonne
     // gere l'espace entre les images
     if (espace_entre_image=="oui") // si espace  on fait une boucle
        {
        espace="";
        retourcharriot1="<BR>";
        retourcharriot="";
        for (j=-1;j<taille_de_l_espace ;j++)
            {
            retourcharriot=retourcharriot1+retourcharriot;
            }
        }
        else                           // si pas espace on fait pas de boucle
       {
       retourcharriot="<BR>";
       espace="";
       }
}
//-----------------------------------------------------------------

document.write('<a href="'+tab_lien[i]+'"');         // affichage des boutons
document.write('onMouseOver="survol(\''+img[3]+'\',\''+img[0]+'\')"');
document.write('onMouseOut="survol(\''+img[3]+'\',\''+img[1]+'\')">');
document.write('<img name=\"'+img[3]+'\" border="0" src="'+img[2]+'"></a>');
document.write (retourcharriot);
document.write (espace);

			}        // fin boucle for1
		}                // fin fonction for2

}                                //fin fonction affiche
//-----------------------------------------------------------------



/* Ne pas oublier de mettre les images dans le repertoire image si on ajoute des liens :)) */

Conclusion

Ce script sera utilisé en toute probabilité sur ce site : http://www.redelap.com
Ce site traite de Filemaker à tous les niveaux.
Un excellent tutorial est fourni, truffé d'exemples applicables.

Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

accueil.html 899 octets
association.html 896 octets
lien1B.gif 574 octets
lien1R.gif 582 octets
lien2B.gif 651 octets
lien2R.gif 662 octets
lien3B.gif 604 octets
lien3R.gif 607 octets
Thumbs.db17 408 octets
index.html 891 octets
menu_de_repere.Js 6 543 octets
query_string_scan.js 1 434 octets
accueil.html 309 octets
association.html 313 octets
coupdecoeur.html 306 octets
filemaker.html 302 octets
lien1B.gif 574 octets
lien1R.gif 582 octets
lien2B.gif 651 octets
lien2R.gif 662 octets
lien3B.gif 604 octets
lien3R.gif 607 octets
lien4B.gif 638 octets
lien4R.gif 642 octets
lien5B.gif 637 octets
lien5R.gif 636 octets
Thumbs.db40 448 octets
index.html 298 octets
rollover_de_navigation_v0-41.js 7 060 octets
accueil.html 516 octets
association.html 520 octets
lien1B.gif 574 octets
lien1R.gif 582 octets
lien2B.gif 651 octets
lien2R.gif 662 octets
lien3B.gif 604 octets
lien3R.gif 607 octets
Thumbs.db17 408 octets
index.html 503 octets
rollover_de_navigation.js 6 332 octets
accueil.html 518 octets
association.html 523 octets
lien1B.gif 574 octets
lien1R.gif 582 octets
lien2B.gif 651 octets
lien2R.gif 662 octets
lien3B.gif 604 octets
lien3R.gif 607 octets
Thumbs.db17 408 octets
index.html 506 octets
rollover_de_navigation.js 7 211 octets
Lisez-moi.txt 3 189 octets
accueil.html 827 octets
association.html 838 octets
coupdecoeur.html 844 octets
filemaker.html 832 octets
lien1B.gif 574 octets
lien1R.gif 582 octets
lien2B.gif 651 octets
lien2R.gif 662 octets
lien3B.gif 604 octets
lien3R.gif 607 octets
lien4B.gif 638 octets
lien4R.gif 642 octets
lien5B.gif 637 octets
lien5R.gif 636 octets
Thumbs.db40 448 octets
liens.html 820 octets
rollover_de_navigation_v0-5.js 10 125 octets
accueil.html 806 octets
association.html 818 octets
coupdecoeur.html 824 octets
filemaker.html 812 octets
lien1B.gif 574 octets
lien1R.gif 582 octets
lien2B.gif 651 octets
lien2R.gif 662 octets
lien3B.gif 604 octets
lien3R.gif 607 octets
Thumbs.db40 448 octets
liens.html 800 octets
rollover_de_navigation_v0-5.js 10 103 octets
accueil.html 831 octets
association.html 844 octets
coupdecoeur.html 849 octets
filemaker.html 838 octets
lien1B.gif 574 octets
lien1R.gif 582 octets
lien2B.gif 651 octets
lien2R.gif 662 octets
lien3B.gif 604 octets
lien3R.gif 607 octets
lien4B.gif 638 octets
lien4R.gif 642 octets
lien5B.gif 637 octets
lien5R.gif 636 octets
Thumbs.db40 448 octets
liens.html 825 octets
rollover_de_navigation_v0-5.js 10 125 octets
Rollover_de_navigation V 0-5.jpg 71 366 octets
Thumbs.db23 040 octets

Télécharger le zip

Historique

30 juillet 2004 05:02:28 :

Sources de la même categorie

EMULATION DE $_GET() DU PHP par jchan

ACCESSIBARRE - AMÉLIORER LE CONFORT DES PERSONNES NON-VOYANT... par Pfuch

CLASS BARRE DE DÉFILEMENT (SCROLLBAR) JAVASCRIPT par TheWeasel47

TAILLEFONTE par tiger222

MOTEUR DE RECHERCHE SANS PHP par jdmcreator

Toutes les sources de la catégorie Navigation

Commentaires et avis

Commentaire de cartoongraphist le 20/02/2004 02:08:15

Pensez juste à laisser l'en-tête de presentation du code. ca me fera plaisir de le voir dans vos sites qui utiliseront ce script :-)
Vous pouvez aussi m'envoyer un petit mail pour me dire que vous l'utiliserez ou que vous le trouvez sympa ;)

Commentaire de montaigne le 20/02/2004 02:43:23

Très biiieeennn ! il marche super bien ton roll.Je vais l'installer sur mon site. J'ai pas testé avec mozilla ca donne quoi?

Commentaire de cartoongraphist le 20/02/2004 03:32:34

Voilà je viens de le tester sous Mozilla FIreFox 0.8 et il fonctionne parfaitement. Si d'autres internautes l'ont testé sur d'autres navigateurs qu'ils me le fasse savoir ;-)
Merci encore.

Commentaire de cartoongraphist le 21/02/2004 04:22:54

Nouvelle version !
La version 0.41 automatise beaucoup de choses et evite de fouiller le code pour ajouter de nouveaux liens et generer des erreurs.

Cette version permet d'ajouter de nouveaux liens très facilement en n'ecrivant que le nom de la page sans même mettre un .html et ceci dans une seule ligne prevue à cet effet !

Il n'y a rien d'autre à faire si ce n'est de créer vos images ;-)
Lisez bien l'encart pour nommer correctement vos images lorsque vous les créerez

J'espere avoir des avis favorables et des encouragements pour mon travail :-)

Commentaire de scriptou le 21/02/2004 04:53:51

ouaaa il est super simple ton script ^^ !
serieux je le trouve bien et super facile a utiliser m'a fallu 5mn pour faire des gif et 10s pour mettre le nom de page thml. je vais l'etudier de plus pres ^^ mais je debute hein !

Commentaire de jeff_the_lifeguard le 21/02/2004 18:06:21

J'ai IE 6 et win xp et rien marche dommage

Commentaire de cartoongraphist le 22/02/2004 05:39:58

C'est curieux, ce script a été testé sur deux machines differentes, sous Internet Explorer 6.026, Mozilla FireFox 0.8 et Mozilla 5.0. Je n'ai rencontré aucun problemes. As-tu par hasard desactivé les scripts sous IE?

Commentaire de cartoongraphist le 23/02/2004 03:16:32

Nouvelle Version 0.5 !!!
Possibilitée de parametrer la presentation sans prendre le risque d'aller dans le code et d'eventuellement générer des erreurs.
Possibilité de situer le script n'importe ou dans les pages web. Les fichiers HTML fournis montre des exemples de differentes presentations dans un tableau HTML.

Voilà, qu'en pensez-vous? :)

Commentaire de scriptou le 23/02/2004 03:23:59

oue ca a l'air de bien marcher. Bonne idée le systeme de parametre utilisateur :p

Commentaire de cartoongraphist le 23/02/2004 15:52:26

Merci à Noël pour ses tests sur d'autres navigateurs.
Voici la liste des navigateurs sur lesquels ce script à été testé:

PC : IE6:ok / Mozilla-FireFox 0.8:ok
     Mozilla 5.0:ok  / Opera:ok

Mac (Os9): Netscape:ok / IE:ok
Mac (OsX) : IE(OsX):ok / Safari:ok

Commentaire de cartoongraphist le 24/02/2004 19:13:12

Une petite erreur s'est glissée dans mon encart de presentation.
Au lieu de lire :

"Pour commencer il suffit de placer les scripts
suivants :
1-
<script src="rollover_de_navigation_v0-41.js"
type="text/javascript"></script>

entre les balises <HEAD> </HEAD> de chaque page."

Il fallait lire :

"our commencer il suffit de placer les scripts
suivants :
1-
<script src="rollover_de_navigation_v0-5.js"
type="text/javascript"></script>

entre les balises <HEAD> </HEAD> de chaque page."

Mais je suis sûr que vous l'aviez tous vu ^^
Le zip et le source sont corrigés .

Commentaire de joelausec le 20/04/2004 15:07:06

Génial! Que dire de plus...
Fini la fastidieuse modification de toutes mes pages à chaque fois que j'ajoute un lien.
Un petit inconvénient tout de même à signaler, le pré-chargement de mes images ne fonctionne pas avec ce script, où alors c'est que je ne sais pas faire. Les abonnés au haut débit n'y verront que du feu, mais pour ceux, qui comme moi, sont connecté en RTC en Creuse dans la France profonde, ça perd un peu de son charme.
Existe-t-il une solution pour le plus que débutant que je suis?

Commentaire de ayane le 14/08/2004 12:05:05

Il est génial!
mais perso je cherche un rollover avec un script (lorsqu'on page sur l'image le script ce met en place) mais j'en trouve nul part qui fonctionne! T_T Aidez moi s'il vous plait!

Commentaire de gomgom le 14/09/2004 10:40:33

Bonjour !

Merci pour cet EXCELLENT script !
J'ai cependant un gros souci...
J'ai plusieurs frames. J'ai placé le script ci-dessus dans la frame de gauche et je voudrais que les liens s'ouvrent dans la frame de droite...
Comment faire ?
Merci d'avance pour votre aide précieuse...

Commentaire de cartoongraphist le 17/09/2004 04:35:00

je vais etudier le probleme des frames et mettre à jour le script, dès que j'aurai un peu de temps. Soyez patient.

Commentaire de Muadib24 le 17/09/2004 08:46:23

Génial : simple et modifiable, bravo ! par contre j'ai modifié le script pour avoir 3 états au lieu de 2, les 3 images se chargent bien, mais quand la souris passe sur le bouton abaissé, il revient à l'état 2, survolé. Grrrr! si qqun sait comment faire, merci

Commentaire de cartoongraphist le 17/09/2004 14:07:15

C'est normal, le script ne gere que deux etats. je vais aussi étudier une solution pour cet aspect des que j'aurai un peu plus de temps. Comme pour gomgom, repasse un peu plus tard voir les maj que j'aurai faites.

Commentaire de lepiaf2000 le 20/11/2005 10:32:33

Merci
Il est extra ton script!

Par contre, on ne peut afficher que 5 images. On peut mettre plus ?

LePiaf

Commentaire de novato le 25/09/2007 12:23:59

merci pour ce script cartoongraphist...(au nom de tous les débutants qui passent des nuits blanches à essayer d'inventer des codes intuitifs qui fonctionnent pas du tout !!!)

ceci dit, je ne sais pas si il va pouvoir me servir car les pages dans lesquelles il serait génial que je puisse l'utiliser sont en php, et au lieu d'ajouter manuellement les images, je fais une requête à une base de données...

est-il possible que cela fonctionne tel quel, puis-je m'en servir comme base avec des modifs, ou dois-je reprendre mon long chemin de doutes vers une autre source (il y a longtemps que j'ai renoncé à y parvenir tout seul !!!)

novato, madrid.

Commentaire de Roxman le 21/10/2008 00:07:46

bonjour,

je voudrais par exemple en tapant l'URL www.monsite.com
arriver sur mon index.php avec le bouton accueil 'Actif'

Chris

Ajouter un commentaire

Nos sponsors

Derniers Blogs

UNE JOLIE-HORLOGE ET PAS QU'UN PEU ! par neodante

TECHDAYS PARIS 2010 : CONNECTEZ VOS DONNéES à SHAREPOINT 2010 AVEC LES BUSINESS CONNECTIVITY SERVICES par ROMELARD Fabrice

[DIVERS] SUIVRE VOS SéRIES PRéFéRéS SUR LA TOILE par orion

TECHDAYS PARIS 2010 : LA BI DANS SHAREPOINT 2010 par ROMELARD Fabrice

TECHDAYS PARIS 2010 : DéPLOIEMENT DE NOUVELLES TECHNOLOGIES - RETOUR D'EXPéRIENCE PAR L'INFORMATIQUE DE MICROSOFT par ROMELARD Fabrice

Forum

J'AI TROUVéE UN CODE SOURCE SUR INTERNET ET J'AI PAS LE COMPRIS par dalinda

RE : RéCUPERER LA TAILLE D'UN DIV par bumbo

RE : PROTOTYPE: PROBLèME AVEC "EVENT" par bumbo

RE : FONCTION RECHERCHE DATE par jeca

Côté IT

Offres d'emploi

Formations Video

Appels d'offres

module flash de personalisation
Budget : 600€
PLATEFORME SUR L ESOTERISME VOYANCE - sans charte graphique
Budget : 3 500€
Joomla 15 module paiement adaptation composant cuisine
Budget : 250€

Logiciels

DB-MAIN (9.1.0)
DB-MAIN (9.1.0)

DB-MAIN is a data-modeling and data-architecture tool. It is designed to help developers and anal...

Cliquez pour télécharger DB-MAIN
Xilisoft DPG Convertisseur (5.1.37.0120)
XILISOFT DPG CONVERTISSEUR (5.1.37.0120)

Xilisoft DPG Convertisseur offre aux fans de Nintendo DS une bonne solution leur permettant de dé...

Cliquez pour télécharger Xilisoft DPG Convertisseur
GraphicsGale (2.01.01)
GRAPHICSGALE (2.01.01)

GraphicsGale est un logiciel de PixelArt avec de nombreuse fonctionnalités permettant de réalisé ...

Cliquez pour télécharger GraphicsGale
Architecte 3D (Platinum 2010)
ARCHITECTE 3D (PLATINUM 2010)

Architecte 3D Platinium vous permet de concevoir facilement les plans votre future maison, de l'é...

Cliquez pour télécharger Architecte 3D
TeamViewer 5 (TeamViewer 5)
TEAMVIEWER 5 (TEAMVIEWER 5)

Dépanner un ami,expliquer une manipulation devient un jeu d'enfant. Prise en main d'un autre ord...

Cliquez pour télécharger TeamViewer 5