Partie programation

Code:

<?php
      $a=<<<END
      onMouseOver="montre('<center><b>Entrer dans <u>Forderoc-Brizelam</u></b><br><i>(Cliquez pour entrer visiteur)</i></center>');" onMouseOut="cache();"  onMouseClick="playsound('son/001.avi');"
END;
         echo '<div id="info" class="infobulle"></div>
            <div id="ville1" '.$a.'>
               <div id="bloc1">
               </div>
            </div>';
      ?>

Code:

      <script type="text/javascript">         var soundfile="son1.wav" //path to sound file, or pass in filename directly into playsound()

function playsound(soundfile){
if (document.all && document.getElementById){
document.getElementById("soundeffect").src="" //reset first in case of problems
document.getElementById("soundeffect").src=soundfile
document.getElementById("soundeffect").volume='10'
}
}

function bindsound(tag, soundfile, masterElement){
if (!window.event) return
var source=event.srcElement
while (source!=masterElement && source.tagName!="HTML"){
if (source.tagName==tag.toUpperCase()){
playsound(soundfile)
break
}
source=source.parentElement
}
}

J'aimerais lire des fichiers sons via JavaScript. Voici une partie du code si quelqu'un peu aider c'est superb ^^

Code:

<audio autoplay="autoplay">
  <source src="truc.mp3" type="audio/mp3" />
</audio>


Code:

<?php
if($secure==1963475)
{

//informations de connexion à la base de donnée

identifiants (remplacer les valeurs qui se trouvent entre guillements) pour se connecter à la principale base de donnée
$login = "qsdqsd";
$motdepasse = "qsdqsdqsd9";

//entre guillement, se trouve le nom de la base de donnée (bdd) principale du site
$nom_bdd = "dhffdgh";
//ici, il faut mettre l'adresse de la base de donnée du serveur (généralement sql.truc.com ou "localhost")
$lien_server = "sql2.redheberg.com";

}
else
{echo"ERROR";exit();}
?>

img { border: none ; }

body{
background-color:#000;
background-image:url(../image/fond/fond4.jpg);
background-repeat:no-repeat;
background-position: 50% 30%;
background-attachment: fixed;
}

div {
text-align:center;
}

a {color:#ffffff;
text-shadow: 1px 1px #000, -1px -1px 10px #000 !important;
}

a:visited{color:#0158EF;
}

a:hover{color:red;
}

div#bloc2a{
font-family:Agency FB;
font-weight: bold;
font-size: 60px;
text-shadow: 2px 2px 1px #aaa;
color:#fff;
size:4px;
width:400px;
height:100px;
margin-top:70px;
margin-left:40px;
position:absolute;
z-index: 5;
background-repeat:no-repeat;
background-position: 0% 0%;
}

div#bloc2a:hover{
font-family:Agency FB;
font-weight: bold;
font-size: 60px;
text-shadow: 0px 0px 10px #fff !important;
color:#000;
size:4px;
width:400px;
height:100px;
margin-top:70px;
margin-left:40px;
position:absolute;
z-index: 5;
background-repeat:no-repeat;
background-position: 0% 0%;
cursor:default;
}

div#bloc3{
width:350px;
height:350px;
margin-top:0px;
margin-left:70%;
background-image:url(../image/fond/fond3.gif);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 2;
}

div#bloc4{
width:700px;
height:0%;
top:150px;
left:50%;
margin-left:-350px;
background-color:#aaa;
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 3;
}

div#bloc4a{
border-radius: 4px;
border-width: 3px;
border-color:#FAC73C;
border-style: solid;
width:700px;
height:100px;
top:0px;
background-image:url(../image/icone/001.png);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 4;
cursor:pointer;
}

div#bloc4a:hover{
border-radius: 4px;
border-width: 3px;
border-color:#FAC73C;
border-style: solid;
width:700px;
height:100px;
top:0px;
background-image:url(../image/icone/001a.png);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 4;
cursor:pointer;
}

div#bloc5a{
border-radius: 4px;
border-width: 3px;
border-color:#FAC73C;
border-style: solid;
width:700px;
height:100px;
top:125px;
background-image:url(../image/icone/002.png);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 4;
cursor:pointer;
}

div#bloc5a:hover{
border-radius: 4px;
border-width: 3px;
border-color:#FAC73C;
border-style: solid;
width:700px;
height:100px;
top:125px;
background-image:url(../image/icone/002a.png);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 4;
cursor:pointer;
}

div#bloc6a{
border-radius: 4px;
border-width: 3px;
border-color:#FAC73C;
border-style: solid;
width:700px;
height:100px;
top:250px;
background-image:url(../image/icone/003.png);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 4;
cursor:pointer;
}

div#bloc6a:hover{
border-radius: 4px;
border-width: 3px;
border-color:#FAC73C;
border-style: solid;
width:700px;
height:100px;
top:250px;
background-image:url(../image/icone/003a.png);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 4;
cursor:pointer;
}

div#bloc7a{
border-radius: 4px;
border-width: 3px;
border-color:#FAC73C;
border-style: solid;
width:700px;
height:100px;
top:375px;
background-image:url(../image/icone/004.png);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 4;
cursor:pointer;
}

div#bloc7a:hover{
border-radius: 4px;
border-width: 3px;
border-color:#FAC73C;
border-style: solid;
width:700px;
height:100px;
top:375px;
background-image:url(../image/icone/004a.png);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 4;
cursor:pointer;
}

div#bloc8a{
border-radius: 4px;
border-width: 3px;
border-color:#FAC73C;
border-style: solid;
width:700px;
height:100px;
top:500px;
background-image:url(../image/icone/005.png);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 4;
cursor:pointer;
}

div#bloc8a:hover{
border-radius: 4px;
border-width: 3px;
border-color:#FAC73C;
border-style: solid;
width:700px;
height:100px;
top:500px;
background-image:url(../image/icone/005a.png);
background-repeat:no-repeat;
background-position: 0% 0%;
position:absolute;
z-index: 4;
cursor:pointer;
}

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

<html>

<head>
<title>Lorem Ipsum | Paragon</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="content-language" content="fr">
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
<meta name="description" content="Site officiel de la guilde Lorem Ipsum evoluant sur le mmorpg World of Warcraft | Serveur Paragon." />
<meta name="title" content="Lørem Ipsum | Paragon" />
<meta property="og:type" content="website">
<meta property="og:url" content="**************************">
<meta name="robots" content="index, follow, all">
<meta name="keywords" content="Lorem Impsum Paragon WoW">
<link rel="stylesheet" href="../css/ateliervisiteur.css" type="text/css" />
<link rel="shortcut icon" type="image/x-icon" href="../image/icone/001.ico" />



<script type="text/javascript"><!--
function GetId(id)
{
return document.getElementById(id);
}
var i=false; // La variable i nous dit si la bulle est visible ou non

function move(e)
{
if(i)
{ // Si la bulle est visible, on calcul en temps reel sa position ideale
if (navigator.appName!="Microsoft Internet Explorer")
{ // Si on est pas sous IE
GetId("info").style.left=e.pageX + 5+"px";
GetId("info").style.top=e.pageY + 10+"px";
}
else
{ // Modif proposé par TeDeum, merci à lui
if(document.documentElement.clientWidth>0)
{
GetId("info").style.left=20+event.x+document.documentElement.scrollLeft+"px";
GetId("info").style.top=10+event.y+document.documentElement.scrollTop+"px";
}
else
{
GetId("info").style.left=20+event.x+document.body.scrollLeft+"px";
GetId("info").style.top=10+event.y+document.body.scrollTop+"px";
}
}
}
}

function montre(text)
{
if(i==false)
{
GetId("info").style.visibility="visible"; // Si il est cacher (la verif n'est qu'une securité) on le rend visible.
GetId("info").innerHTML = text; // on copie notre texte dans l'élément html
i=true;
}
}

function cache()
{
if(i==true)
{
GetId("info").style.visibility="hidden"; // Si la bulle est visible on la cache
i=false;
}
}
document.onmousemove=move; // dès que la souris bouge, on appelle la fonction move pour mettre à jour la position de la bulle.
//-->
var soundfile="son1.wav" //path to sound file, or pass in filename directly into playsound()

function cacher()
{
document.body.style.overflow='hidden';
}


</script>
</head>

<body onload="cacher()">

<?php

$a=<<<END
onMouseOver="montre('<center><b>Atelier</b><br><i>(Calculateur de talents - Guide des classes -</br>WoWHead - JudgeHype - Cybermage</br>Outil BugTracker)</i></center>');" onMouseOut="cache();" onMouseClick="playsound('son/001.avi');"
END;
echo '<div id="bloc2a">Lørem Ipsum</div>
<div id="bloc4">
<a href="http://worldofwarcraft.judgehype.com/" target="_blanck"><div id="bloc4a">
</div></a>
<a href="http://old.wowhead.com/" target="_blanck"><div id="bloc5a">
</div></a>
<a href="http://www.cybermage.info/" target="_blanck"><div id="bloc6a">
</div></a>
<a href="http://talent.mmo-champion.com/?warlock#,,12213/" target="_blanck"><div id="bloc7a">
</div></a>
<a href="https://loremipsum.forumgaming.fr/f25-rapport-de-bugs/" target="_blanck"><div id="bloc8a">
</div></a>
</div>
';
?>

</body>

</html>