Partage
  • Partager sur Facebook
  • Partager sur Twitter

Positionner une popup dhtml sur une page web

    1 janvier 2009 à 15:27:59

    Bonjour,
    je voudrais positionner une popup dhtml que j'ai DL sur easy-scritp il me semble.
    Sur l'exemple elle se situe (a mon avis) par default, cad en haut a gauche, j'aimerai la placer comme bon me semble.
    Voici le code du JS:

    Citation : fichier .js

    var IE5=(document.getElementById && document.all)? true : false;
    var W3C=(document.getElementById)? true: false;
    var currIDb=null, currIDs=null, xoff=0, yoff=0; zctr=0; totz=0;

    function trackmouse(evt){
    if((currIDb!=null) && (currIDs!=null)){
    var x=(IE5)? event.clientX+document.body.scrollLeft : evt.pageX;
    var y=(IE5)? event.clientY+document.body.scrollTop : evt.pageY;
    currIDb.style.left=x+xoff+'px';
    currIDs.style.left=x+xoff+10+'px';
    currIDb.style.top=y+yoff+'px';
    currIDs.style.top=y+yoff+10+'px';
    return false;
    }}

    function stopdrag(){
    currIDb=null;
    currIDs=null;
    NS6bugfix();
    }

    function grab_id(evt){
    xoff=parseInt(this.IDb.style.left)-((IE5)? event.clientX+document.body.scrollLeft : evt.pageX);
    yoff=parseInt(this.IDb.style.top)-((IE5)? event.clientY+document.body.scrollTop : evt.pageY);
    currIDb=this.IDb;
    currIDs=this.IDs;
    }

    function NS6bugfix(){
    if(!IE5){
    self.resizeBy(0,1);
    self.resizeBy(0,-1);
    }}

    function incrzindex(){
    zctr=zctr+2;
    this.subb.style.zIndex=zctr;
    this.subs.style.zIndex=zctr-1;
    }

    function createPopup(id, title, width, height, x , y , isdraggable, boxcolor, barcolor, shadowcolor, text, textcolor, textptsize, textfamily, titlecolor ){
    if(W3C){
    zctr+=2;
    totz=zctr;
    var txt='';
    txt+='<div id="'+id+'_s" style="position:absolute; left:'+(x+10)+'px; top:'+(y+10)+'px; width:'+width+'px; height:'+height+'px; background-color:'+shadowcolor+'; filter:alpha(opacity=50); visibility:visible"> </div>';
    txt+='<div id="'+id+'_b" style="border:outset '+barcolor+' 2px; position:absolute; left:'+x+'px; top:'+y+'px; width:'+width+'px; overflow:hidden; height:'+height+'px; background-color:'+boxcolor+'; visibility:visible">';
    txt+='<div style="width:'+width+'px; height:16px; background-color:'+barcolor+'; padding:0px; border:1px"><table cellpadding="0" cellspacing="0" border="0" width="'+(IE5? width-4 : width)+'"><tr><td width="'+(width-20)+'"><div id="'+id+'_h" style="width:'+(width-20)+'px; height:14px; font: bold 12px Arial; color:'+titlecolor+'"> '+title+'</div></td><td align="right"><a onmousedown="document.getElementById(\''+id+'_s\').style.display=\'none\'; document.getElementById(\''+id+'_b\').style.display=\'none\';return false"><img src="closeb.gif" border="0" height="15" width="15"></a></td></tr></table></div>';
    txt+='<div id="'+id+'_ov" width:'+width+'px; style="margin:2px; color:'+textcolor+'; font:'+textptsize+'pt '+textfamily+';">'+text+'</div></div>';
    document.write(txt);
    this.IDh=document.getElementById(id+'_h');
    this.IDh.IDb=document.getElementById(id+'_b');
    this.IDh.IDs=document.getElementById(id+'_s');
    this.IDh.IDb.subs=this.IDh.IDs;
    this.IDh.IDb.subb=this.IDh.IDb;
    this.IDh.IDb.IDov=document.getElementById(id+'_ov');
    if(IE5){
    this.IDh.IDb.IDov.style.width=width-6;
    this.IDh.IDb.IDov.style.height=height-22;
    this.IDh.IDb.IDov.style.scrollbarBaseColor=boxcolor;
    this.IDh.IDb.IDov.style.overflow="auto";
    }else{
    this.IDh.IDs.style.MozOpacity=.5;
    }
    this.IDh.IDb.onmousedown=incrzindex;
    if(isdraggable){
    this.IDh.onmousedown=grab_id;
    this.IDh.onmouseup=stopdrag;
    }}}

    if(W3C)document.onmousemove=trackmouse;
    if(!IE5 && W3C)window.onload=NS6bugfix;



    Merci pour votre aide (je ne connais rien en Javascript)
    • Partager sur Facebook
    • Partager sur Twitter
      1 janvier 2009 à 19:22:41

      Y'a pas d'explications sur le site où tu l'as téléchargé ? Non parce que c'est pas que ça soit spécialement compliqué mais y'a un argument pour lequel je ne vois pas quoi mettre (le troisième en partant de la fin)...

      Bref, il faut que tu utilises la fonction createPopup(), essaye avec cette ligne, ça t'aidera je pense ;) :

      createPopup('test', 'test', 500, 500, 250, 250 , true, 'blue', 'red', 'black', 'Je test', null, 'Arial', 'yellow');
      
      • Partager sur Facebook
      • Partager sur Twitter
        1 janvier 2009 à 19:26:05

        C'est un script de porc ce script de drag'n drop ...
        Trouve en un autre mieux ;) .
        • Partager sur Facebook
        • Partager sur Twitter
          1 janvier 2009 à 19:27:29

          J'avoue qu'il est vraiment pas génial :-° .
          • Partager sur Facebook
          • Partager sur Twitter
            2 janvier 2009 à 8:24:03

            Merci pour vos réponses
            si vous en connaissez un bien codé dites ou je peux le trouver, car celui la j'ai mi des heures à le trouver.
            merci pour votre aide
            • Partager sur Facebook
            • Partager sur Twitter
              3 janvier 2009 à 17:21:30

              J'ai pas compris, tu veux créer une popup ou juste pouvoir la déplacer avec la souris ?
              • Partager sur Facebook
              • Partager sur Twitter

              Positionner une popup dhtml sur une page web

              × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
              × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
              • Editeur
              • Markdown