ich möchte gern für meine Firmenseite (http://www.hochflaechendesign.de) News oder Sonderangebote als Layer einbinden. wie z.B. diese Grafik Winterangebot , das ganze sollte per Klick auf Kreuz oder "schließen" verschwinden und auch nur einmal pro Besucher und Tag auftauchen. Ist sowas machbar und wenn ja wie. Habe schon 2 Tage gegoogelt aber so richtig will das nicht gehen entweder der Layer ist im Hintergrund oder er taucht bei jeder seite auf. Ein normaler Popup kommt auch nicht in Frage da dieser ehh geblockt wird.
Layer für Ankündigungen? Aber wie
-
-
- Gerade eben
- Anzeige
Hallo!
Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.
- ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
- ✔️ Deutsche Server & DSGVO-konform
- ✔️ Persönlicher Support (kein 0815-Ticket-System)
-
Du möchtest ein Cookie setzen.
http://de.php.net/manual/de/features.cookies.php -
möchte ich das? kann schon sein aber erst bräuchte ich ein Script oder Code welcher auch funktioniert, also einen Layer anzeigt. Den Cookie brauche ich doch nur damit geregelt wird das er pro besucher nur einmal erscheint? oder?
Als Popup hat ich die ganze Sache schon drin aber Popups werden zu 90% geblockt -
möchte ich das? kann schon sein aber erst bräuchte ich ein Script oder Code welcher auch funktioniert, also einen Layer anzeigt. Den Cookie brauche ich doch nur damit geregelt wird das er pro besucher nur einmal erscheint? oder?
Als Popup hat ich die ganze Sache schon drin aber Popups werden zu 90% geblocktUm zu wissen ob ein User den Layer bereits gesehen hat, ist es am einfachsten ein Cookie zu setzen. Oder einen Eintrag in die DB, oder in eine Textdatei.
Wie auch immer, Cookie ist da am sinnigsten
-
erst bräuchte ich ein Script oder Code welcher auch funktioniert, also einen Layer anzeigt.
Zitat[...] entweder der Layer ist im Hintergrund oder er taucht bei jeder seite auf [...]
Ich bin davon ausgegangen dass das zumindest vom Ansatz her schon klappt. Wenn du etwas Code postest dann knn ich dir vielleicht auch zeigen wo dein Fehler ist.ZitatDen Cookie brauche ich doch nur damit geregelt wird das er pro besucher nur einmal erscheint? oder?
Ja. Die Anzeige des Layers kannst du ann entweder per PHP oder per JS steuern. Beide können auf dein Cookie zugreifen.ZitatAls Popup hat ich die ganze Sache schon drin aber Popups werden zu 90% geblockt
Popups werden zu annähernd 100% geblockt wenn sie ohne User-Interaktion geöffnet werden. -
Bei Googeln bich auf diese Seite gestoßen
http://www.jswelt.de/index.php?open…rtid=1007495790
hatte es dann auch eingebaut aber der Layer wurde irgendwie nur hinter meinem eigentlichem Design angezeigt. Hier der Code.
PHP
Alles anzeigen<style type="text/css"> <!-- #sponsorAdDiv {position:absolute; height:1; width:1; top:0; left:0;} --> </style> <SCRIPT LANGUAGE="JavaScript1.2"> /* DHTML Ad Box (By Matt Gabbert- tax@nolag.com, http://www.nolag.com) */ adTime=10; // seconds ad reminder is shown chanceAd=1; // ad will be shown 1 in X times (put 1 for everytime) var ns=(document.layers); var ie=(document.all); var w3=(document.getElementById && !ie); adCount=0; function initAd(){ if(!ns && !ie && !w3) return; if(ie) adDiv=eval('document.all.sponsorAdDiv.style'); else if(ns) adDiv=eval('document.layers["sponsorAdDiv"]'); else if(w3) adDiv=eval('document.getElementById("sponsorAdDiv").style'); randAd=Math.ceil(Math.random()*chanceAd); if (ie||w3) adDiv.visibility="visible"; else adDiv.visibility ="show"; if(randAd==1) showAd(); } function showAd(){ if(adCount<adTime*10){adCount+=1; if (ie){documentWidth =document.body.offsetWidth/2+document.body.scrollLeft-20; documentHeight =document.body.offsetHeight/2+document.body.scrollTop-20;} else if (ns){documentWidth=window.innerWidth/2+window.pageXOffset-20; documentHeight=window.innerHeight/2+window.pageYOffset-20;} else if (w3){documentWidth=self.innerWidth/2+window.pageXOffset-20; documentHeight=self.innerHeight/2+window.pageYOffset-20;} adDiv.left=documentWidth-200;adDiv.top =documentHeight-200; setTimeout("showAd()",100);}else closeAd(); } function closeAd(){ if (ie||w3) adDiv.display="none"; else adDiv.visibility ="hide"; } onload=initAd; //End--> </script> <div id="sponsorAdDiv" style="visibility:hidden"> <table width="450" height="350" bgcolor="#008000"><tr><td> <table width="445" height="345" bgcolor="#F0FFF0"><tr><td align="center" valign="middle"> <!--*****EDIT THIS MESSAGE*****--> <a href="http://www.hochflaechendesign.de/winterangebot-dachgeschossausbau/" target=""><img border="0" src="http://www.hochflaechendesign.de/wp-content/uploads/winterangebot.png" width="500" height="550"></a><br><br><br> Dieses Fenster schliesst sich in ein paar Sekunden! <!--*****EDIT THE ABOVE MESSAGE*****--> </td></tr></table></td></tr></table> </div> -
Ohje, bitte vergiss das ganz schnell wieder. ;-)
Vorschlag: Bau erstmal das HTML für den Layer zusammen und formatiere das per CSS so, dass es vernünftig aussieht. Einen Close-Link kannst du auch schon vorsehen. Der Container für den Layer bekommt ein id-Attribut.
Beim Über-den-Content-legen hilft dir position:absolute und z-index:[ganzGroßerWert]
http://www.css4you.de/position.html
http://www.css4you.de/z-index.htmlWenn du das hast, dann kommt noch ein wenig JavaScript dazu, um den Layer wieder auszublenden. Das sieht im einfachsten Fall so aus:
Dazu kommt dann noch das Cookie. Wie du Cookies per JS setzt findest du hier:
http://de.selfhtml.org/javascript/bei…itenbesuche.htm
(Per JS, damit es beim 1. Aufruf per PHP noch nicht zur Verfügung steht.)Wenn du das hast, dann brauchst du nur noch per PHP prüfen ob das Cookie gesetzt ist und entsprechend den Layer ausgeben oder nicht.
-
Was sehr schön klappt ist dieses hier, schließt sich aber nach nur ca 2 Sekunden wieder. Habe den Code in der Header ganz oben eingebaut? Richtig?
PHP
Alles anzeigen<script language="JavaScript1.2"> var ns4=document.layers var ie4=document.all var ns6=document.getElementById&&!document.all //drag drop function for NS 4//// ///////////////////////////////// var dragswitch=0 var nsx var nsy var nstemp function drag_dropns(name){ if (!ns4) return temp=eval(name) temp.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP) temp.onmousedown=gons temp.onmousemove=dragns temp.onmouseup=stopns } function gons(e){ temp.captureEvents(Event.MOUSEMOVE) nsx=e.x nsy=e.y } function dragns(e){ if (dragswitch==1){ temp.moveBy(e.x-nsx,e.y-nsy) return false } } function stopns(){ temp.releaseEvents(Event.MOUSEMOVE) } //drag drop function for ie4+ and NS6//// ///////////////////////////////// function drag_drop(e){ if (ie4&&dragapproved){ crossobj.style.left=tempx+event.clientX-offsetx crossobj.style.top=tempy+event.clientY-offsety return false } else if (ns6&&dragapproved){ crossobj.style.left=tempx+e.clientX-offsetx crossobj.style.top=tempy+e.clientY-offsety return false } } function initializedrag(e){ crossobj=ns6? document.getElementById("showimage") : document.all.showimage var firedobj=ns6? e.target : event.srcElement var topelement=ns6? "HTML" : "BODY" while (firedobj.tagName!=topelement&&firedobj.id!="dragbar"){ firedobj=ns6? firedobj.parentNode : firedobj.parentElement } if (firedobj.id=="dragbar"){ offsetx=ie4? event.clientX : e.clientX offsety=ie4? event.clientY : e.clientY tempx=parseInt(crossobj.style.left) tempy=parseInt(crossobj.style.top) dragapproved=true document.onmousemove=drag_drop } } document.onmousedown=initializedrag document.onmouseup=new Function("dragapproved=false") ////drag drop functions end here////// function hidebox(){ if (ie4||ns6) crossobj.style.visibility="hidden" else if (ns4) document.showimage.visibility="hide" } </script> <div id="showimage" style="position:absolute;width:250px;left:10;top:10"> <table border="0" width="100" bgcolor="#CCCCCC" cellspacing="0" cellpadding="2"> <tr> <td width="100%"><table border="0" width="100%" cellspacing="0" cellpadding="0" height="36"> <tr> <td id="dragbar" style="cursor:hand" width="100%"><ilayer width="100%" onSelectStart="return false"><layer width="100%" onMouseover="dragswitch=1;if (ns4) drag_dropns(showimage)" onMouseout="dragswitch=0"><font face="Verdana" color="#FFFFFF"><strong><small>Anzeige</small></strong></font></layer></ilayer></td> <td style="cursor:hand" valign="middle"><a href="#" onClick="hidebox();return false"><b><font color="#f5f5f5">x</font></b></a></td> </tr> <tr> <td width="100%" bgcolor="#FFFFFF" style="padding:4px" colspan="2"> <!-- Inhalt ----> <img class="alignnone size-full wp-image-389" title="winterangebot" src="http://www.hochflaechendesign.de/wp-content/uploads/winterangebot.png" alt="" width="600" height="600"> <!-- Inhalt ----> </td> </tr> </table> </td> </tr> </table> </div> -
Was sehr schön klappt ist dieses hier
Aha. Halte ich aufgrund der vielen Syntaxfehler, die ich mit bloßen Auge sehe, zwar für ein Gerücht, aber gut. Vielleicht frissts dein Browser ja. :-)
(Aber ich möchte mich gerne wiederholen: vergiss das ganz schnell wieder! Die Zeiten von IE4 und Netscape 4 sind lange vorbei. In aktuellen Browsern sind JS 1.7 oder 1.8 implementiert, wenn ich das richtig in Erinnerung habe.)Zitatschließt sich aber nach nur ca 2 Sekunden wieder
Cool. Und das ganz ohne timeout()-Funktion. Lustig. :-)ZitatHabe den Code in der Header ganz oben eingebaut? Richtig?
Ganz oben im Sinne von "ganz ganz oben"? Im <head>-Bereich wäre richtig.
Jetzt mitmachen!
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!