begin process at 2012 05 29 02:48:37
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

JavaScript et le navigateur

 > 

Problème de compatibilité

 > 

animation images transparentes

Derniers messages déposésPoser une question dans le forum ou lancer une discussion

animation images transparentes

vendredi 1 juin 2007 à 10:18:50 | animation images transparentes

lucdcs
bonjour à tous

je suis novice mais je me soigne toutefois il me reste un petit problème dans mon code.
avec l'aide des internautes la gestion de la transparence sous IE 5.5 et 6 a été résolue mais au détriment de l'animation en place avant le correctif
les fonds d' images sont transparent dans un menu animé du genre manège ruban et maintenant elles sont fixes et à des emplacements assez fantaisistes donc mon problème et de rendre leur mobilité à toutes ces images.
je précise tout de même que cela fonctionne depuis un code html, un code css et 2 codes js, collé ci-dessous.
j'ai donc  des questions pour les plus avertis d'entre vous:
- 2 codes peuvent-ils être présents pour un même objet
- y a t-il une notion de priorité dans le cas où ce serait possible
- comment formaliser cette priorité
Je suis preneur de toutes les méthodes envisageables.
Merci.
Je tiens à préciser que vu mon niveau je ne suis pas le créateur des codes mais que je les ai adaptés et merci aux auteurs qui ont laissé les codes à disposition des novices.

code html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " [ Lien ]">

<html xmlns=" [ Lien ]" >
<head>
<title>
Menu du site
</title>
<script language="JavaScript" type="text/javascript" src="MenuDeroulant.js"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
<script defer type="text/javascript" src="pngfix.js"></script>

</head>
<body onload="javascript:Affichage();">
<div id="divMenuRuban">
<img id="i1" src="images/icone_index.png" class="imag" alt="Accueil" title="site officiel de l'US Lalinde Handball" onclick="javascript:Lien(this);"/>
<img id="i2" src="images/icone_actus.png" class="imag" alt="Actualités" title="La vie du club"onclick="javascript:Lien(this);"/>
<img id="i3" src="images/icone_resultats.png" class="imag" alt="Résultats"title="Tous les résultats" onclick="javascript:Lien(this);"/>
<img id="i4" src="images/icone_classements.png" class="imag" alt="Classements"title="Tous les classements "onclick="javascript:Lien(this);"/>
<img id="i5" src="images/icone_galeries.png" class="imag" alt="Galeries" title="Toutes les photos"onclick="javascript:Lien(this);"/>
<img id="i6" src="images/icone_partenaires.png" class="imag" alt="Partenaires"title="Sponsors et liens divers "onclick="javascript:Lien(this);"/>
<img id="i7" src="images/icone_arbitrage.png" class="imag" alt="Arbitrage" title="Des doutes= des réponses"onclick="javascript:Lien(this);"/>
<img id="i8" src="images/icone_technique.png" class="imag" alt="Technique" title="Un peu de formation"onclick="javascript:Lien(this);"/>
<img id="i9" src="images/icone_next.png" class="imag" alt="Prochains matches"title="Au suivant" onclick="javascript:Lien(this);"/>
<img id="i10" src="images/icone_last.png" class="imag" alt="Derniers matches" title="Tous les résumés"onclick="javascript:Lien(this);"/>
<img id="i11" src="images/icone_contacts.png" class="imag" alt="Contacts" title="comment nous contacter ? "onclick="javascript:Lien(this);"/>
<img id="i12" src="images/icone_vide.png" class="imag" alt="Vide" title="En construction"onclick="javascript:Lien(this);"/>
<img id="Imgfond" src="images/logo_main_500_400_bis.png" alt="logo" usemap="#Menu" style="border:0" />
<map id="Menu" name="Menu">
<area shape="rect" alt="Gauche" coords="0,0,500,200" onmouseover="javascript:DefilementGauche();" onMouseOut="javascript:ArretDefilement();" href="" />
<area shape="rect" alt="Droite" coords="0,0,800,600" onmouseover="javascript:DefilementDroite();" onMouseOut="javascript:ArretDefilement();" href="" />
</map>
</div>
</body>
</html>


code css:

body
{
width:800px;
margin:left; /* Pour centrer notre page */
margin-top:20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
margin-bottom:10px; /* Idem pour le bas du navigateur */
background-color: black;
}

.imag
{
position:absolute;
cursor: hand;
border : 0;
}

#divMenuRuban
{
position:absolute;
top :50px;
left : 180px;
}

code js:

// Fichier JavaScript

var angle=0;
var timer;
var FlgDefilement = "Non";

function Affichage ()
{
for(i=1;i<13;i++)
{
var Gauche = 180+300*(Math.cos(angle+i*Math.PI/6));//emplacement du menu déroulant par rapport à l'image de fond//
document.getElementById("i"+i).style.left=Gauche+"px";
var Hauteur = 80+50*(Math.sin(angle+i*Math.PI/6))+document.getElementById("i"+i).width/2;
document.getElementById("i"+i).style.top=Hauteur+"px";
agl=angle+i*Math.PI/6;
document.getElementById("i"+i).width=45*(Math.sin(agl))+60;//taille des icones//
document.getElementById("i"+i).style.zIndex=200*(Math.sin(agl))+400;
document.getElementById("i"+i).style.opacity=(Math.sin(agl)+1)*0.50;
document.getElementById("i"+i).style.filter="alpha(opacity="+(Math.sin(agl)+1)*200+")";

}
}

function Defilement()
{
switch (FlgDefilement)//vitesse de défilement//
{
case "Droite" :
angle=angle-0.015;
break;
case "Gauche" :
angle=angle+0.015;
break;
default :
angle=angle;
}
Affichage ();
}

function DefilementDroite()
{
if (FlgDefilement!="Droite")
{
FlgDefilement="Droite";
timer=setInterval("Defilement()",20);
}
}

function DefilementGauche()
{
if (FlgDefilement!="Gauche")
{
FlgDefilement="Gauche";
timer=setInterval("Defilement()",20);
}
}

function ArretDefilement()
{
clearInterval(timer);
FlgDefilement="Non";
}

function Lien (LienRedirection)
{
switch(LienRedirection.id)
{
case "i1" :
document.location=" [ Lien ]"
break;
case "i2" :
document.location=" [ Lien ]"
break;
case "i3" :
document.location=" [ Lien ]"
break;
case "i4" :
document.location=" [ Lien ]"
break;
case "i5" :
document.location=" [ Lien ]"
break;
case "i6" :
document.location=" [ Lien ]"
break;
case "i7" :
document.location=" [ Lien ]"
break;
case "i8" :
document.location=" [ Lien ]"
break;
case "i9" :
document.location=" [ Lien ]"
break;
case "i10" :
document.location=" [ Lien ]"
break;
case "i11" :
document.location=" [ Lien ]"
break;
case "i12" :
document.location=" [ Lien ]"
break;
}
}


code js:
/*

Correctly handle PNG transparency in Win IE 5.5 & 6.
[ Lien ] Updated 18-Jan-2006.

Use in <HEAD> with DEFER keyword wrapped in conditional comments:
<!--[if lt IE 7]>
<script defer type="text/javascript" src="pngfix.js"></script>
<![endif]-->

*/

var arVersion = navigator.appVersion.split("MSIE")
var version = parseFloat(arVersion[1])

if ((version >= 5.5) && (document.body.filters))
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
img.outerHTML = strNewHTML
i = i-1
}
}
}


Cette discussion est classée dans : case, http, var, document, img

Répondre à ce message

Sujets en rapport avec ce message

Liste déroulante + Image [ par GaL34 ] Je fais appel à vous une fois de plus car ayant enfin réussi a crée ma liste déroulante avec un affichage de photo celle ci ne marche pas sous firefox probleme de décimal [ par karim2100 ] BONJOURDepuis deux jours je suis entrain de résoudre le probleme des decimals pour mon code mais en vain.j ai essayé -Math.round- et - to.Fixed(2) san XMLHTTPRequest & FF [ par spinosaurus ] Bonjour à toutes et tousje galère depuis plusieurs jours pour rendre compatible multi-navigateur un de mes scripts utilisant du XHR. Je suis allé foui Vérification d'extension [ par Homeros ] Bonjour, j'ai fait un script pour pouver vérifier l'extension des fichiers uploader,mais le code m'affiche la boite d'alert a chaque upload est il blo Refus de supprimer un document ouvert dans une application (Permission denied) [ par terog ] Bonjour à toutes et tous.Après quelques nombreuses recherches infructueuses sur le net, voici un petit problème que je soumet à votre sagacité.Un docu Nouvelle fenetre [ par ayoubpro ] Bonjour tout le monde J'ai un petit formulaire( avec des cases à cocher),on peut choisir les bonnes réponses et le script javascript c calculer via un formulaire [ par cedcyr ] bonjour je vien de realiser un formulaire lier a code javascript il n'y a apparament pas d'erreur et pourtant la boucle ne se fait pas pourquoi voici Question [ par ichigokurosaki ] Bonjour,Bon voilà, j'ai un petit souci avec ce code :test  var saisie = ""; var compteur = 1; GetElementByTagName dans un tableau [ par jubourbon ] Bonjour à tous,J'ai une fonction, qui me permet de recuperer des avleurs dans un tableau, de rechercher des Expressions Regulieres, puis de les modifi envois de formulaire ajax [ par Annadrill ] bonjour,voilà, j'aimerais modifier la fonction que je vous mets la dessous, de manière a pouvoir l'utiliser avec n'importe quel formulaire, en précisa


Nos sponsors


Sondage...

Comparez les prix


Mio - Moov V735 - GPS Europe - Ecran 7"
Entre 305€ et 375€

Visiter le guide achat

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

Photo Frau auf Feld mit KopfsalatPhoto Underwater
Photo Sea star and sponges 

Visiter la photothèque

A découvrir
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 4,446 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)