11548 sujets

JavaScript, DOM et API Web HTML5

bonjour, pouvez vous m'aider à ouvrir ce code dans une nouvelle page?

dans la partie head, voici ce que j'ajoute :
<body onclick="{window.location.href='http://www.google.fr';}" >

dans le script externe, voici le code :

var largeur_div_milieu = 1050; // largeur de la div centrale pour les calculs
var marge = 0; // Marge entre le bleu et le vert pour eviter d'executer la fonction si on clique juste à la limite
var mouseX;
var status;
// Permet de savoir si il y a une scrollbar dans firefox afin de savoir la largeur précise du site
function checkScrollBar()
{
if(document.documentElement.scrollHeight != window.innerHeight)
return 16
else
return 0
}
// Verifie si la position de la souris permet le clic
function verifyMouseX()
{
if(mouseX<=((windowSize()-largeur_div_milieu)/2)-marge|| mouseX>=((windowSize()-largeur_div_milieu)/2)+largeur_div_milieu+marge)
return true;
else
return false;
}
// Retoune la position X de la souris
function getMouseX(event)
{
var e = event || window.event;
return e.clientX;
}
// Retoune la taille de l'ecran
function windowSize()
{
if (document.all)
{
return document.documentElement.clientWidth;
}
else
{
return window.innerWidth-checkScrollBar();
}
}
document.onmousemove = function(event){
var mouseInfo = document.getElementById('mouseInfo');
mouseX = getMouseX(event);
if(verifyMouseX()){
document.body.style.cursor = 'pointer';
}
else{
document.body.style.cursor = 'auto';
}
if(verifyMouseX())
status = "&nbsp;";
else

status = "&nbsp;";
};
Bonjour,

Remplace ton
<body onclick="{window.location.href='http://www.google.fr';}" >

par
<body onclick="window.open('http://www.google.fr')" >


Cordialement.
oups, ce code marche sauf que en plus du body, lorsque l'on clic dans le contenu de ma page web, le lien du body s'ouvre. que faire
Modifié par billantwi (22 Sep 2011 - 12:04)
C'est normal puisque que l’événement est sur "onclick".

Que souhaites tu faire ? je ne comprends pas trop ta question.
Si c'est l'ouverture de la page au chargement tu peux utiliser
onLoad="window.open('http://www.google.fr')"
ce que je voudrai faire, c'est d'ajouter une image background à mon site (publicité) et lorsque mes internautes cliquerons sur cette image, que le lien de mes annonceur s'ouvre. plusieurs site le font cependant, je n'arrive pas à percer ce mystère.
J'ai peut être une solution toute bête (que j'utilise régulièrement)


<a title="" href="http://www.google.fr" onclick="window.open(this); return false;">
<span id="pub"></span>
</a>


Tu positionnes #pub où tu le souhaites sur ta page grâce au css.
Celui-ci sera cliquable grâce à la balise <a></a>
C'est valide W3C en plus.
j'ai insérer le code dans ma partie head (sans résultat) ainsi que dans la partie body (sans résultat). pouvez vous me dire comment faire?
L'élément cliquable pour la pub doit être à quel endroit sur l'écran ?
Connaissez vous les feuilles de style css ?
Ok, je viens de comprendre, avec une image c'est plus simple...

Voila une des méthodes :

Dans le head, tu mets ton css :

<style type="text/css" media="screen">
html, body {height: 100%; padding:0; margin:0; color:#CF3}
#fond_cliquable { position: absolute; height:100%; width:100%; margin:auto; cursor:pointer; background:#CF3}
#contenu { position: absolute; width:800px; height:500px; margin-top:100px; left:50%; margin-left:-400px; background-color:#000}
</style>


Et ensuite le body :
<a href="http://www.google.fr" title="Google.fr"><span id="fond_cliquable"></span></a>
<div id="contenu"> 
<p>Ici ton contenu de page</p>
</div> <!-- Fin Contenu -->


L'ensemble reste à adapter à ta structure bien sur.

@+
Modifié par panoramixas (26 Sep 2011 - 13:16)
bonjour panoramixas. je pense qu'une solution javascript serai mieux car j’essaie d'appliquer votre dernière méthode mais elle marche pas car ma page subie des déformation importantes. bien avant cela, j'ai essayer cette méthode qui a l'air d’être semblable au votre (http://www.agir19.free.fr/test.php), mais toujours des déformations. je vous renvoi un autre screenshoot de mon site en construction.
http://www.hostingpics.net/viewer.php?id=22423720110926114947.png
Ma solution fonctionne, tout comme celle d' "agir19".
Si cette solution CSS modifie le reste de votre page, c'est que celle-ci n'est pas correctement agencée ou ne repecte pas les règles CSS.
De plus, une solution CSS est moins lourde que du java-script.
merci, problème résolue. j'ai superposer deux div, j'ai mi une en arrière plan avec une image transparente, et l'autre contenant le corps de mon site au dessus. merci a tous surtout à panoramixas pour sa disponibilité et son aide.