como crear un prepoup

jporsi · #1 (**permalink**) 17/07/2007, 13:43

me interesaria saber como crearme un prepoup (layer) para mi aca les dejo uno de una empresa pero quisiera saber como crearme uno para mi en particular.

<div id="DirectaLayer" style="visibility:visible; position:absolute; left: 150px; top: 50px; width: 720px; height: 300px; z-index: 2;" onClick="document.getElementById('DirectaLayer').s tyle.visibility='hidden';">
<div align="right">
 <input name="Submit" type="button" tabindex="1" value="X" onClick="document.getElementById('DirectaLayer').s tyle.visibility='hidden';" style="z-index:2; position:absolute; left:690px; width:30px; padding:0px;">
</div>
<script type="text/javascript" language="javascript">
var resizeableScriptURL = "http://ad.directanetworks.com/st?ad_type=pop&ad_size=0x0&section=188450&banned_p op_types=23&pop_times=1&pop_frequency=0&nopopblock ing=0";
var fixedScriptURL = "http://ad.directanetworks.com/st?ad_type=pop&ad_size=0x0&section=188450&banned_p op_types=23&prepopped_width=720&prepopped_height=3 00&pop_times=1&pop_frequency=0&nopopblocking=0";

function doPopAction()
{
var ventana = open("about:blank","","directories=no,location=no, menubar=no,status=no,titlebar=no,toolbar=no",false );
if(ventana!=null)
{
document.getElementById("DirectaLayer").style.visi bility="hidden";
ventana.blur();
ventana.document.write("<html><head><title>Directa Network's Advertisement</title></head><body marginwidth=0 marginheight=0 leftmargin=0 topmargin=0><scr" + "ipt type=\"text/javascript\" language=\"javascript\" src=\"" + resizeableScriptURL + "\"></scr" + "ipt></body></html>");
}
else
{
if (window != window.parent)
return;
document.write("<html><head></head><body marginwidth=0 marginheight=0 leftmargin=0 topmargin=0><scr" + "ipt type=\"text/javascript\" language=\"javascript\" src=\"" + fixedScriptURL + "\"></scr" + "ipt></body></html>");
document.getElementById("DirectaLayer").style.visi bility="visible";
}
}

doPopAction();
</script>

Copp · #2 (**permalink**) 23/11/2007, 09:47

Aqui tienes un codigo que encontre en una web:

Código:

// Script Source: CodeLifter.com
// Copyright 2003
// Do not remove this header

isIE=document.all;
isNN=!document.all&&document.getElementById;
isN4=document.layers;
isHot=false;

function ddInit(e){
  topDog=isIE ? "BODY" : "HTML";
  whichDog=isIE ? document.all.theLayer : document.getElementById("theLayer");  
  hotDog=isIE ? event.srcElement : e.target;  
  while (hotDog.id!="titleBar"&&hotDog.tagName!=topDog){
    hotDog=isIE ? hotDog.parentElement : hotDog.parentNode;
  }  
  if (hotDog.id=="titleBar"){
    offsetx=isIE ? event.clientX : e.clientX;
    offsety=isIE ? event.clientY : e.clientY;
    nowX=parseInt(whichDog.style.left);
    nowY=parseInt(whichDog.style.top);
    ddEnabled=true;
    document.onmousemove=dd;
  }
}

function dd(e){
  if (!ddEnabled) return;
  whichDog.style.left=isIE ? nowX+event.clientX-offsetx : nowX+e.clientX-offsetx; 
  whichDog.style.top=isIE ? nowY+event.clientY-offsety : nowY+e.clientY-offsety;
  return false;  
}

function ddN4(whatDog){
  if (!isN4) return;
  N4=eval(whatDog);
  N4.captureEvents(Event.MOUSEDOWN|Event.MOUSEUP);
  N4.onmousedown=function(e){
    N4.captureEvents(Event.MOUSEMOVE);
    N4x=e.x;
    N4y=e.y;
  }
  N4.onmousemove=function(e){
    if (isHot){
      N4.moveBy(e.x-N4x,e.y-N4y);
      return false;
    }
  }
  N4.onmouseup=function(){
    N4.releaseEvents(Event.MOUSEMOVE);
  }
}

function hideMe(){
  if (isIE||isNN) whichDog.style.visibility="hidden";
  else if (isN4) document.theLayer.visibility="hide";
}

function showMe(){
  if (isIE||isNN) whichDog.style.visibility="visible";
  else if (isN4) document.theLayer.visibility="show";
}

document.onmousedown=ddInit;
document.onmouseup=Function("ddEnabled=false");

</script>
<!-- BEGIN FLOATING LAYER CODE //-->
<div id="theLayer" style="position:absolute;width:250px;left:100;top:100;visibility:visible">
<table border="0" width="250" bgcolor="#FF0000" cellspacing="0" cellpadding="5">
<tr>
<td width="100%">
  <table border="0" width="100%" cellspacing="0" cellpadding="0" height="36">
  <tr>
  <td id="titleBar" style="cursor:move" width="100%">
  <ilayer width="100%" onSelectStart="return false">
  <layer width="100%" onMouseover="isHot=true;if (isN4) ddN4(theLayer)" onMouseout="isHot=false">
  <div align="center"><em><strong><font color="#FFFFFF" face="Arial">Haz Click</font></strong></em></div>
  </layer>  </ilayer>  </td>
  <td style="cursor:hand" valign="top">
  <a href="#" onClick="hideMe();return false"><font color=#ffffff size=2 face=arial  style="text-decoration:none">X</font></a>
  </td>
  </tr>
  <tr>
  <td width="100%" bgcolor="#FFFFFF" style="padding:4px" colspan="2">
<!-- PLACE YOUR CONTENT HERE //-->  
AQUI CODIGO HTML
<!-- END OF CONTENT AREA //-->
  </td>
  </tr>
  </table> 
</td>
</tr>
</table>
</div>
<!-- END FLOATING LAYER CODE //-->

Donde pone AQUI CODIGO HTML tienes que poner, lo que quieras que aparezca en el layer. Una imagen, un banner, un texto....lo que quieras. Lo que no he conseguido hacer es que salga una URL pero seguramente eso te sirva.

Saludos