Large close button not showing

Printable View

07-03-2020, 08:21 PM
Wads

Large close button not showing

Re:. IE10+Exit Intent Pop Up Script (with mobile fallback)

Where do I add the class to get the large close button?

Code:

div.closeexitpop{ /* Large x close button */ width: 70px; height: 70px; overflow: hidden; display: none; position: fixed; cursor: pointer; text-indent: -1000px; z-index: 3; top: 10px; right: 10px; }

Current HTML code.

Code:

<div id="ddexitpop1" class="ddexitpop"> <p align="center"> <a class="calltoaction" href="#">DONATE HERE</a> <a href="#" onClick="ddexitpop.hidepopup()">[Close Window]</a> </p> </div>

I've tried adding another division within existing division and just adding class on to exiting division but the closer button still does not show...
07-06-2020, 12:46 AM
keyboard

Hi Wads and welcome.
Unfortunately your post got caught in the spam filter. I've approved it now and hopefully someone will be able to help.
07-06-2020, 05:53 PM
coothead

Hi there Wads,

I would suggest that your problem lies here...

Code:

div.closeexitpop{ /* Large x close button */

.It should be...

Code:

div.ddexitpop{ /* Large x close button */

coothead
07-07-2020, 02:21 AM
Wads

Thanks coothead...

Nope, that did not fix it. The large close button doesn't show
07-07-2020, 09:01 AM
coothead

Hi there Wads,

your problem is not with the CSS, it is with your installation of the DD code.

Your basic document should look like this...

Code:

<!DOCTYPE HTML> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1"> <title>Untitled document</title> <link rel="stylesheet" href="http://dynamicdrive.com/dynamicindex8/exitpopup/ddexitpop.css" media="screen"> </head> <body> <div id="ddexitpop1" class="ddexitpop"> <p style="text-align:center"> <a class="calltoaction" href="#">DONATE HERE</a> <a href="#" onClick="ddexitpop.hidepopup()">[Close Window]</a> </p> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script src="http://dynamicdrive.com/dynamicindex8/exitpopup/ddexitpop.js"></script> <script> jQuery(function(){ ddexitpop.init({ contentsource: ['id', 'ddexitpop1'], fxclass: 'random', hideaftershow: false, displayfreq: 'always', onddexitpop: function($popup){ console.log('Exit Pop Animation Class Name: ' + ddexitpop.settings.fxclass) } }) }) </script> </body> </html>

I would suggest, though, that you do not use that script at all.
It is a surefire way of aggravating visitors to your site.

coothead
07-08-2020, 10:30 PM
Wads

Thanks. That did not work either.

No where in the above code does it style the close button.
07-09-2020, 01:38 AM
coothead

Hi there Wads,

you did not mention, that you were totally incapable of doing any basic coding.

You just wrote that it did not show.
So the code that I gave made Everything Show.

If you now want it styled , don't say that it doesn't work,
just say could you kindly style it for me.

Code:

<!DOCTYPE HTML> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1"> <title>Untitled document</title> <link rel="stylesheet" href="http://dynamicdrive.com/dynamicindex8/exitpopup/ddexitpop.css" media="screen"> <style media="screen"> #ddexitpop1 { padding: 1em; text-align: center; } #close { display: inline-block; padding:0.8em 1.6em; border-radius: 0.3em; background-color: #15c5ff; box-shadow: inset 0 0 1em rgba(0, 0, 0, 0.4), 0.4em 0.4em 0.4em rgba(0, 0, 0, 0.4); font-size: 1.25em; font-weight: bold; color: #fff; text-decoration: none; } </style> </head> <body> <div id="ddexitpop1" class="ddexitpop"> <a class="calltoaction" href="#">DONATE HERE</a> <a id="close" href="#" onClick="ddexitpop.hidepopup()"> [ Close Window ] </a> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script src="http://dynamicdrive.com/dynamicindex8/exitpopup/ddexitpop.js"></script> <script> jQuery(function(){ ddexitpop.init({ contentsource: ['id', 'ddexitpop1'], fxclass: 'random', hideaftershow: false, displayfreq: 'always', onddexitpop: function($popup){ console.log('Exit Pop Animation Class Name: ' + ddexitpop.settings.fxclass) } }) }) </script> </body> </html>

coothead
07-09-2020, 02:12 AM
Wads

Snapzilla!!!! Geez!!
07-09-2020, 08:22 AM
coothead

No problem, you're very welcome. :D

coothead