Accueil > > > POPUP À LA POSITION DE LA SOURIS
POPUP À LA POSITION DE LA SOURIS
Information sur la source
Description
Petite popup dimensionnée qui s'ouvre à la position du lien, donc de la souris. Egalement donc le script d'ouverture de popup positionné et dimensionné en fonction de la résolution d'écran est incorporé.
Source
- <html>
- <head>
- <style>
- p {margin:10px 0px 10px 150px ;}
- </style>
- <script type="text/javascript" language="JavaScript">
- var Coordx = 0;
- var Coordy = 0;
- var info1 = null;
- e=window.event;
- function mousex(e){
- if(document.layers) {return e.x;}
- else {return event.clientX;}
- }
- function mousey(e){
- if(document.layers) {return event.y;}
- else {return event.clientY;}
- }
- function coord(e){
- Coordx = mousex();
- Coordy = mousey();
- Coordy = Coordy + 100;
- }
- function ow0(theURL,larg,haut,posX,posY)
- {
- larg = Math.ceil(screen.width * (larg/100)*(1024/screen.width));
- if(larg > screen.width) {larg = Math.ceil(larg*(95/100));}
- haut = Math.ceil(screen.height * (haut/100));
- if (info1)
- {
- info1.close();
- info1 = window.open(theURL,"info1","scrollbars=yes,menubar=yes,resizable=yes,width="+ larg +"px,height="+ haut +"px,outerwidth="+ larg +"px,outerheight="+ haut +"px,top="+posY+",left="+posX+",screenX="+posX+",screenY="+posY);
- info1.focus();
- }
- else {
- info1 = window.open(theURL,"info1","scrollbars=yes,menubar=yes,resizable=yes,width="+ larg +"px,height="+ haut +"px,outerwidth="+ larg +"px,outerheight="+ haut +"px,top="+posY+",left="+posX+",screenX="+posX+",screenY="+posY);
- info1.focus();
- }
-
- }
- </script>
- </head>
- <body onClick="javascript:info1.close();">
- <p><br><br><br><br><br><br><a href="#" onMouseOver="javascript:coord(event);ow0('http://www.javascriptfr.com',35,35,Coordx,Coordy)">Javascriptfr</a></p>
- <p><a href="#" onMouseOver="javascript:coord(event);ow0('http://www.allhtml.com',35,35,Coordx,Coordy)">allhtml</a></p>
- </body>
- </html>
<html>
<head>
<style>
p {margin:10px 0px 10px 150px ;}
</style>
<script type="text/javascript" language="JavaScript">
var Coordx = 0;
var Coordy = 0;
var info1 = null;
e=window.event;
function mousex(e){
if(document.layers) {return e.x;}
else {return event.clientX;}
}
function mousey(e){
if(document.layers) {return event.y;}
else {return event.clientY;}
}
function coord(e){
Coordx = mousex();
Coordy = mousey();
Coordy = Coordy + 100;
}
function ow0(theURL,larg,haut,posX,posY)
{
larg = Math.ceil(screen.width * (larg/100)*(1024/screen.width));
if(larg > screen.width) {larg = Math.ceil(larg*(95/100));}
haut = Math.ceil(screen.height * (haut/100));
if (info1)
{
info1.close();
info1 = window.open(theURL,"info1","scrollbars=yes,menubar=yes,resizable=yes,width="+ larg +"px,height="+ haut +"px,outerwidth="+ larg +"px,outerheight="+ haut +"px,top="+posY+",left="+posX+",screenX="+posX+",screenY="+posY);
info1.focus();
}
else {
info1 = window.open(theURL,"info1","scrollbars=yes,menubar=yes,resizable=yes,width="+ larg +"px,height="+ haut +"px,outerwidth="+ larg +"px,outerheight="+ haut +"px,top="+posY+",left="+posX+",screenX="+posX+",screenY="+posY);
info1.focus();
}
}
</script>
</head>
<body onClick="javascript:info1.close();">
<p><br><br><br><br><br><br><a href="#" onMouseOver="javascript:coord(event);ow0('http://www.javascriptfr.com',35,35,Coordx,Coordy)">Javascriptfr</a></p>
<p><a href="#" onMouseOver="javascript:coord(event);ow0('http://www.allhtml.com',35,35,Coordx,Coordy)">allhtml</a></p>
</body>
</html>
Conclusion
Ici sur un onMouseOver, et qui peut se refermer avec un click sur le fond d'écran. (body onClick). Dans tous les cas, une deuxième se rouvre dans la même fenêtre. Changez les options d'ouverture...
Sources du même auteur
DHTML - MANIP CSSDHTML - MANIP CSS Beaucoup de façons de changer une page en manipulations dhtml et css, en inner et outer Text/HTML.
Des choses intéressantes.
Certaines peuvent paraî...
OUVERTURE POPUP À URL ALÉATOIREOUVERTURE POPUP À URL ALÉATOIRE Ouverture ici automatique au chargement de la page.
Aléatoire parmi une liste d'URL définis en Array.
Popup positionnée et dimensionnée, selon scree...
96 SITES RÉPERTORIÉS : HTML, CSS, DHTML, JAVA, JAVASCRIPT, P...96 SITES RÉPERTORIÉS : HTML, CSS, DHTML, JAVA, JAVASCRIPT, PHP-CGI Page où sont répertoriés 96 sites internet pour webmasters, javascript, css, dhtml, php-cgi, java et autres. En français et anglais (souvent)
+ fonct...
BROWSER SNIFFER (RENIFLEUR)BROWSER SNIFFER (RENIFLEUR) Script qui n'est pas de moi, en exemple, extrait de <http://www.webreference.com/js>, et qui donne trop d'informations et comporte trop de liens vers ...
DHTML SCROLLTOPDHTML SCROLLTOP Présentez sur écran!
Suite du scroll au top mais assez suffisemment avancée pour être mise seule.
Toujours un menu mascable/affichable par clic sur ...
Sources de la même categorie
Commentaires et avis
|
Derniers Blogs
MYTIC - SHAREPOINT 2010 : DéJà UN MYTHE MICROSOFT ?MYTIC - SHAREPOINT 2010 : DéJà UN MYTHE MICROSOFT ? par junarnoalg
La prochaine session de MyTIC aura lieu à Namur, le 23 mars prochain. Pendant presque une heure, nous parlerons de SharePoint 2010. Voici un aperçu du programme.
Accueil : 17h30 Début de la session : 18h00 - Les nouvelles int...
Cliquez pour lire la suite de l'article par junarnoalg [MIX10] KEYNOTE DEUXIèME JOURNéE - INTERNET EXPLORER 9, HTML5, VISUAL STUDIO 2010, ODATA[MIX10] KEYNOTE DEUXIèME JOURNéE - INTERNET EXPLORER 9, HTML5, VISUAL STUDIO 2010, ODATA par cyril
Le deuxième keynote du mix fut très riche en contenu. Internet Explorer 9 Juste un après le lancement de Internet Explorer 8, Microsoft a dévoilé les nouveautés de Internet Explorer 9. Désormais, IE supportera HTML5, SVG et CSS3. L'élément ...
Cliquez pour lire la suite de l'article par cyril CERTIFICATIONS BETA .NET 4CERTIFICATIONS BETA .NET 4 par KooKiz
Les inscriptions pour les certifications beta .NET 4 ont commencé. L'inscription est offerte pour les examens suivants : - 71-511, TS: Windows Applications Development with Microsoft .NET Framework 4 - 71-515, TS: Web Applications Development with...
Cliquez pour lire la suite de l'article par KooKiz [MIX 2010] - MICROSOFT TRANSLATOR TECHNOLOGY PREVIEW V2[MIX 2010] - MICROSOFT TRANSLATOR TECHNOLOGY PREVIEW V2 par redo
J'imagine que la plupart d'entre vous connaissent bien et utilisent le service de traduction de Google, mais connaissez-vous celui de Microsoft . Microsoft Translator ? Effectivement, Microsoft nous annoncé le lancement version 2 de la Technologie Preview...
Cliquez pour lire la suite de l'article par redo
Logiciels
Academy System (10.9.4.0)ACADEMY SYSTEM (10.9.4.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System Xilisoft Convertisseur Vidéo Ultimate (5.1.39.0305)XILISOFT CONVERTISSEUR VIDéO ULTIMATE (5.1.39.0305)Xilisoft Convertisseur Vidéo Ultimate est un outil puissant de conversion vidéo, facile à utilise... Cliquez pour télécharger Xilisoft Convertisseur Vidéo Ultimate Xilisoft DVD Ripper Ultimate (5.0.64.0304)XILISOFT DVD RIPPER ULTIMATE (5.0.64.0304)Xilisoft DVD Ripper Ultimate est un logiciel excellent pour copier et convertir DVD vers presque ... Cliquez pour télécharger Xilisoft DVD Ripper Ultimate Rigs of Rods (63.3)RIGS OF RODS (63.3)c'est un jeu de multi-simulation camions,autobus voitures, avions, bateaux, hélicoptère avec défo... Cliquez pour télécharger Rigs of Rods
|