/ Forside/ Teknologi / Udvikling / Java Scripts / Spørgsmål
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
Popup vindue
Fra : bangsi
Vist : 780 gange
50 point
Dato : 09-04-07 10:33

Hej

Jeg vil gerne have lavet et popup vindue, som de har på www.gratisting.dk

Er der nogen som kan hjælpe... Det skal ikke være større en dette. På forhånd tak for hjælpen

//Bangsi

 
 
Kommentar
Fra : CLAN


Dato : 09-04-07 10:45

Har du prøvet at kigge på http://www.html.dk/scripts/


Kommentar
Fra : CLAN


Dato : 09-04-07 10:52
Kommentar
Fra : disken


Dato : 09-04-07 10:59

Kan ikke se deres popups, for min firewall,
Men dette program kan lave det hele.
http://www.steenmartinsen.dk/forum/showthread.php?tid=15

Kommentar
Fra : molokyle


Dato : 09-04-07 11:23

Det er en IKKE helt simpel pop-up ting du der ønsker !

Det har ikke meget at gøre med en 'normal' javascript pop-up rutine og den fanges IKKE af nogen kendt pop-up stopper !!!

Det er samme type som findes her på kandu.dk, når man første gang i døgnet logger ind her på siderne med brugernavn og password. Den som fortæller, at det er første gang man er logget på idag og dermed modtager 20 point.

Koden er baseret på en rimelig kompliceret tilgang til sidens DOM (Document Object Model: http://www.w3schools.com/htmldom/dom_reference.asp ) vha. Javascript.

Du kan se den her:
Kode
var popupWinoldonloadHndlr=window.onload, popupWinpopupHgt, popupWinactualHgt, popupWintmrId=-1, popupWinresetTimer;

var popupWintitHgt, popupWincntDelta, popupWintmrHide=-1, popupWinhideAfter=-1, popupWinhideAlpha, popupWinhasFilters=true;

var popupWinnWin, popupWinshowBy=null, popupWindxTimer=-1, popupWinpopupBottom;



var popupWinnText,popupWinnMsg,popupWinnTitle,popupWinbChangeTexts=false;



window.onload=popupWinespopup_winLoad;



function popupWinespopup_ShowPopup(show)

{

if (popupWindxTimer!=-1) { el.filters.blendTrans.stop(); }



if ((popupWintmrHide!=-1) && ((show!=null) && (show==popupWinshowBy)))

{

clearInterval(popupWintmrHide);

popupWintmrHide=setInterval(popupWinespopup_tmrHideTimer,popupWinhideAfter);

return;

}

if (popupWintmrId!=-1) return;

popupWinshowBy=show;



elCnt=document.getElementById('popupWin_content')

elTit=document.getElementById('popupWin_header');

el=document.getElementById('popupWin');

el.style.left='';

el.style.top='';

el.style.filter='';



if (popupWintmrHide!=-1) clearInterval(popupWintmrHide); popupWintmrHide=-1;



document.getElementById('popupWin_header').style.display='none';

document.getElementById('popupWin_content').style.display='none';



if (navigator.userAgent.indexOf('Opera')!=-1)

el.style.bottom=(document.body.scrollHeight*1-document.body.scrollTop*1

-document.body.offsetHeight*1+1*popupWinpopupBottom)+'px';



if (popupWinbChangeTexts)

{

popupWinbChangeTexts=false;

document.getElementById('popupWinaCnt').innerHTML=popupWinnMsg;

document.getElementById('popupWintitleEl').innerHTML=popupWinnTitle;

}



popupWinactualHgt=0; el.style.height=popupWinactualHgt+'px';

el.style.visibility='';

if (!popupWinresetTimer) el.style.display='';

popupWintmrId=setInterval(popupWinespopup_tmrTimer,(popupWinresetTimer?1000:20));

}



function popupWinespopup_winLoad()

{

if (popupWinoldonloadHndlr!=null) popupWinoldonloadHndlr();



elCnt=document.getElementById('popupWin_content')

elTit=document.getElementById('popupWin_header');

el=document.getElementById('popupWin');

popupWinpopupBottom=el.style.bottom.substr(0,el.style.bottom.length-2);



popupWintitHgt=elTit.style.height.substr(0,elTit.style.height.length-2);

popupWinpopupHgt=el.style.height;

popupWinpopupHgt=popupWinpopupHgt.substr(0,popupWinpopupHgt.length-2); popupWinactualHgt=0;

popupWincntDelta=popupWinpopupHgt-(elCnt.style.height.substr(0,elCnt.style.height.length-2));



if (true)

{

popupWinresetTimer=true;

popupWinespopup_ShowPopup(null);

}

}

function popupWinespopup_tmrTimer()

{

el=document.getElementById('popupWin');

if (popupWinresetTimer)

{

el.style.display='';

clearInterval(popupWintmrId); popupWinresetTimer=false;

popupWintmrId=setInterval(popupWinespopup_tmrTimer,20);

}

popupWinactualHgt+=5;

if (popupWinactualHgt>=popupWinpopupHgt)

{

popupWinactualHgt=popupWinpopupHgt; clearInterval(popupWintmrId); popupWintmrId=-1;

document.getElementById('popupWin_content').style.display='';

if (popupWinhideAfter!=-1) popupWintmrHide=setInterval(popupWinespopup_tmrHideTimer,popupWinhideAfter);

}

if (popupWintitHgt<popupWinactualHgt-6)

document.getElementById('popupWin_header').style.display='';

if ((popupWinactualHgt-popupWincntDelta)>0)

{

elCnt=document.getElementById('popupWin_content')

elCnt.style.display='';

elCnt.style.height=(popupWinactualHgt-popupWincntDelta)+'px';

}

el.style.height=popupWinactualHgt+'px';

}



function popupWinespopup_tmrHideTimer()

{

clearInterval(popupWintmrHide); popupWintmrHide=-1;

el=document.getElementById('popupWin');

if (popupWinhasFilters)

{

backCnt=document.getElementById('popupWin_content').innerHTML;

backTit=document.getElementById('popupWin_header').innerHTML;

document.getElementById('popupWin_content').innerHTML='';

document.getElementById('popupWin_header').innerHTML='';

el.style.filter='blendTrans(duration=1)';

el.filters.blendTrans.apply();

el.style.visibility='hidden';

el.filters.blendTrans.play();

document.getElementById('popupWin_content').innerHTML=backCnt;

document.getElementById('popupWin_header').innerHTML=backTit;



popupWindxTimer=setInterval(popupWinespopup_dxTimer,1000);

}

else el.style.visibility='hidden';

}



function popupWinespopup_dxTimer()

{

clearInterval(popupWindxTimer); popupWindxTimer=-1;

}



function popupWinespopup_Close()

{

if (popupWintmrId==-1)

{

el=document.getElementById('popupWin');

el.style.filter='';

el.style.display='none';

if (popupWintmrHide!=-1) clearInterval(popupWintmrHide); popupWintmrHide=-1;



}

}







var popupWinmousemoveBack,popupWinmouseupBack;

var popupWinofsX,popupWinofsY;

function popupWinespopup_DragDrop(e)

{

popupWinmousemoveBack=document.body.onmousemove;

popupWinmouseupBack=document.body.onmouseup;

ox=(e.offsetX==null)?e.layerX:e.offsetX;

oy=(e.offsetY==null)?e.layerY:e.offsetY;

popupWinofsX=ox; popupWinofsY=oy;



document.body.onmousemove=popupWinespopup_DragDropMove;

document.body.onmouseup=popupWinespopup_DragDropStop;

if (popupWintmrHide!=-1) clearInterval(popupWintmrHide);

}



function popupWinespopup_DragDropMove(e)

{

el=document.getElementById('popupWin');

if (e==null&&event!=null)

{

el.style.left=(event.clientX*1+document.body.scrollLeft-popupWinofsX)+'px';

el.style.top=(event.clientY*1+document.body.scrollTop-popupWinofsY)+'px';

event.cancelBubble=true;

}

else

{

el.style.left=(e.pageX*1-popupWinofsX)+'px';

el.style.top=(e.pageY*1-popupWinofsY)+'px';

e.cancelBubble=true;

}

if ((event.button&1)==0) popupWinespopup_DragDropStop();

}



function popupWinespopup_DragDropStop()

{

document.body.onmousemove=popupWinmousemoveBack;

document.body.onmouseup=popupWinmouseupBack;

}


Jeg er ikke klar over hvilket firma som har udviklet koden, men du kan jo spørge webmaster på 'Gratis ting' eller se om du kan råbe kandu teamet op ...det sidste er nok lige så svært som at skrive koden selv

Der findes masser af den slags professionelle løsninger 'derude', men vær forberedt på at mange af dem er copyrightbelagt og koster penge at benytte. Ovenstående hedder tilsyneladende noget med: "Winespopup" ..men jeg har ikke liiiiige kunne finde yderligere dokumentation.

</MOLOKYLE>

Accepteret svar
Fra : molokyle

Modtaget 50 point
Dato : 09-04-07 11:33

Her er en rutine som ligner en smule, men er mere traditionel.
Kode
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Flydende vindue</title>
<script type="text/javascript">
<!--
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>
<style type="text/css">
<!--
body {
background:#fff;
color:#000;
font-family:arial,tahoma,verdana,sans-serif;
font-size:0.75em;
font-style: normal;
border:0px;
padding:8px;
margin:0px;
}

a:link{color:#ffff;}
a:active{color:#ffff00;}
a:visited{color:#ff0000;}
//-->
</style>
</head>
<body>

<div id="theLayer" style="position:absolute;width:250px;left:100;top:100;visibility:visible;">
<table border="0" width="250" bgcolor="#000000" cellspacing="0" cellpadding="1">
<tr>
<td width="100%">
<table border="0" width="100%" cellspacing="0" cellpadding="4" 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">
<font face="Arial" color="#ffffff">Overskrift.</font>
</layer>
</ilayer>
</td>
<td>
<a href="#" onClick="hideMe();return false" style="text-decoration:none;a:visited:#ffffff;font-family:arial san

serif;font-weight:bold;color:#000000;background:#ffffff;padding:0px 2px 0px 2px;margin-right:4px;">X</a>
</td>
</tr>
<tr>
<td width="100%" bgcolor="#ffffff" style="padding:4px" colspan="2">
<br/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Molokyles Window Pop !!!
<br/>
&nbsp;
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<p>
<a href="javascript:showMe();">&#197;bn</a>
</p>
<p>
<a href="javascript:hideMe();">Luk</a>
</p>
</body>
</html>


</MOLOKYLE>

Kommentar
Fra : molokyle


Dato : 09-04-07 11:38

Ps. Grundet manglende tid og dovenskab supporterer jeg ikke den specifikke rutine. Du må selv rette den til, så den passer til netop dit formål. Til gengæld er der ingen copyright. Du må frit benytte og rette i koden.

</MOLOKYLE>

Kommentar
Fra : disken


Dato : 09-04-07 11:55

Og husk en ting, det TILTRÆKKER ikke ligefrem brugere,
at få en popup lige i skærmen.

Kommentar
Fra : molokyle


Dato : 09-04-07 12:28

...i XHTML 1.0 strict DTD og i XHTML 1.1 er det ligefrem 'forbudt' at lave pop-up's med markør scriptet og parameteren 'target' eksisterer slet ikke, men er udgået! Det er stadig 'tilladt' med Javascripting at lave pop-up's, men kan IKKE anbefales. Jeg vil til enhver tid fraråde at implementere pop-up rutiner på hjemmesiden i Javascript!

Begrundelsen for dette er:

Det er ubehøvlet at pille ved brugerens navigation og browser udseende/opsætning/funktionalitet.

En bruger kan altid selv til hver en tid vælge at få åbnet et nyt vindue ved at højreklikke på et link og dernæst vælge: "Åbn i et nyt vindue" ...hvis man virkelig er så 'glad' for at få smadret sin navigations historik.

</MOLOKYLE>

Kommentar
Fra : CLAN


Dato : 09-04-07 13:25

Enig... ved at benytte pop-up(s), kan du risikere, at der lukkes af for din side af brugeren, og så har du tabt 100%... altså overvej om det i det hele taget er 'det værd.
Et simpelt eksempel er hvorledes Kandu's pop-up "blacklistes" - se:
http://www.kandu.dk/tip15832.aspx


Godkendelse af svar
Fra : bangsi


Dato : 10-04-07 19:08

Tak for svaret molokyle. Det er kanon, takker mange gange....

//Bangsi

Kommentar
Fra : molokyle


Dato : 10-04-07 22:08

Jamen... velbekommelse

</MOLOKYLE>

Du har følgende muligheder
Eftersom du ikke er logget ind i systemet, kan du ikke skrive et indlæg til dette spørgsmål.

Hvis du ikke allerede er registreret, kan du gratis blive medlem, ved at trykke på "Bliv medlem" ude i menuen.
Søg
Reklame
Statistik
Spørgsmål : 177558
Tips : 31968
Nyheder : 719565
Indlæg : 6408924
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste