Need HTML? Want to use CSS (cascading style sheets)? Need a touch of help with Javascript, Java, or other coding language? Whether through SBI!'s BlockBuilder 2 or your own HTML Editor, post here. Push the envelope. Learn basics (ex., how to format your text, add tables) or go as "out there" as you like. Problems? Questions? Help and be helped.

Moderators: Laura from Chautauqua, Will from Los Ojos

#1376598 by Paul from Mollymook Beach, NSW
Thu Jul 13, 2017 5:55 am
Hi
I recently discovered a terrific popup created by Carole from http://www.the-best-websites.co.uk. I have implemented it but am looking for a way to delay before it starts working. At the moment it is designed to appear when the curser is positioned to leave the site.

But its possible it displays too early if someone is a random curser mover like me. So I am hopeful someone may have a mechanism for delaying it.

You can see it in action at [Domain Private] (home page)

The code consists of some Java in the head and 2 lots of HTML on the page. The HTML at the bottom does have an entry:
Code: Select alltimer: 0,
but changing that doesn't seem to have made a difference.

If you are interested in exploring this pop up more then it is located at http://www.the-best-websites.co.uk/exit ... l-sbi.html

There is also a related thread on a slightly different popup at https://forums.sitesell.com/viewtopic.php?p=1212324#p1212324 and a TNT article at http://sbitips.sitesell.com/create-popu ... -form.html

Hope you can help
Thanks!
Paul
#1376617 by Juri from plainlight.com
Thu Jul 13, 2017 11:58 am
Hi Paul,

Try adding a delay property to the script in the Footer:

Code: Select allvar _ouibounce = ouibounce(document.getElementById('ouibounce-modal'), {
  aggressive: true,
  timer: 0,
  delay: 3000,
  callback: function() { console.log('ouibounce fired!'); }
});

The value is time in milliseconds.

Kind regards,
J.
#1376621 by Paul from Mollymook Beach, NSW
Thu Jul 13, 2017 12:58 pm
Juri from plainlight.com wrote:Hi Paul,

Try adding a delay property to the script in the Footer:

Code: Select allvar _ouibounce = ouibounce(document.getElementById('ouibounce-modal'), {
  aggressive: true,
  timer: 0,
  delay: 3000,
  callback: function() { console.log('ouibounce fired!'); }
});

The value is time in milliseconds.

Hi Juri. Thanks for the quick response

Hmm - it seems to actually prevent it form operating it at all. I have left it in place to see if you see anything different.

Edited to add: Oops - no - it does come up but it seems more like a few minutes at a guess.... Perhaps 3?

Thanks!
Paul
#1376623 by Juri from plainlight.com
Thu Jul 13, 2017 1:17 pm
Hi Paul,

I've just tested the new version on your page. I think it works as intended [in Firefox on Windows 10]: the popup appears if I leave the cursor on the tab for "and-one-and-two-and-three".

As I understand the original code -- and your intention --, if you remove the cursor during the delay, nothing happens. 3000 [= 3 seconds] is only an estimate; play with several values. 500 is for half a second, for example.

The optimum should be not too big to let escaping visitors still see the popup, 200, 300?

Kind regards,
J.
#1376624 by Paul from Mollymook Beach, NSW
Thu Jul 13, 2017 1:21 pm
Hi again. Actually it would probably be a minute or so as we only want the people who are on the site at least that long (and to not offend Google) but I will experiment further with the process and time tomorrow.

Thanks for getting back so quick. Much appreciated

Paul
#1376627 by Juri from plainlight.com
Thu Jul 13, 2017 1:45 pm
Paul from Mollymook Beach, NSW wrote:Actually it would probably be a minute or so as we only want the people who are on the site at least that long

Oh, now I get it (I think). If you want the whole to work in the original way, but only after some latent time spent on the page, it needs a different approach.

Kind regards,
J.
#1376705 by Juri from plainlight.com
Fri Jul 14, 2017 10:48 am
Hi Paul,

If you are still at this, that's what I found out.

The value of the timer property, in milliseconds, postpones the popup display until after the specified time spent on page, as you suggested.

The aggressive property set to 'false' prevents the popup from showing up more than once. This can be further configured to wait for a specified number of days only before firing again, by defining the cookieExpire property.

Additionally, the cursor should remain in the "dangerous" area on top of the browser window for delay milliseconds to trigger the popup.

So, using timer: 60000, aggressive: true, delay: 500 should wait for one minute on page, then fire when the user stays with the cursor in the tab area for .5 sec.

With aggressive: false, cookieExpire: 30 the popup will snooze for 30 days and returning visitors who saw it.

Hope this helps.

Kind regards,
J.
#1376770 by Paul from Mollymook Beach, NSW
Sat Jul 15, 2017 12:05 am
Hi Juri

Def still at it - just been away.

I will follow up tomorrow. Many thanks!

Paul
#1376796 by Paul from Mollymook Beach, NSW
Sat Jul 15, 2017 10:22 am
Juri from plainlight.com wrote:The value of the timer property, in milliseconds, postpones the popup display until after the specified time spent on page, as you suggested.

The aggressive property set to 'false' prevents the popup from showing up more than once. This can be further configured to wait for a specified number of days only before firing again, by defining the cookieExpire property.

Additionally, the cursor should remain in the "dangerous" area on top of the browser window for delay milliseconds to trigger the popup.

So, using timer: 60000, aggressive: true, delay: 500 should wait for one minute on page, then fire when the user stays with the cursor in the tab area for .5 sec.

With aggressive: false, cookieExpire: 30 the popup will snooze for 30 days and returning visitors who saw it.

This indeed helps and I think we have done it. I have set the cookieExpire to 5 days but apart from that we are up and running :)

My only other question relates to the use of your word 'page'. If I put this in as a (mostly) sitewide block will the timing be accumulating? For example - if it is only one page its quite possible they would spend less than a minute on a page but they could spend well more than a minute on the site. These are the people we are wanting to make this offer to.

So - it would still apply sitewide in your experience? I do realise I can just test it too but I wanted to make sure there weren't any coding distinctions. :wink:

Thanks!
Paul
#1376802 by Juri from plainlight.com
Sat Jul 15, 2017 1:42 pm
Paul from Mollymook Beach, NSW wrote:So - it would still apply sitewide in your experience?

No, I am pretty sure this only works page-wise. JavaScript is document-centric, with document relating to a single page. Making some of its variables global and available from several pages requires some kind of external storage all pages have access to, e.g., a cookie.

So, to create a site-wide timer, you'd probably need to

  • add another script to every page which will
    1. check for a domain-wide cookie named, say, "enteredWithinMinute"
    2. set the cookie, if it doesn't exist yet, and let it expire after a minute
  • instead of the built-in on-page timer of the popup, modify its code to appear only if your above cookie is expired
This is just an idea, so some testing will be needed :wink:

Kind regards,
J.
#1377314 by Paul from Mollymook Beach, NSW
Sat Jul 22, 2017 9:04 am
Hi Juri

I have actually just expanded the code through the site as a sitewide dot. This may seem surprising but really, I am only after people who stay on a particular page for a good length of time. Its my subtle way of qualifying the visitors!

Anyway - it seems to be working but I do have one final question if that's OK...

Am I giving conflicting instructions here? I am basically giving someone .5secs to be at the nav area AND blocking the popup from reappearing for 5 days. Your instructions above implied to me that they may need to display different to how I have them here...

Code: Select all<script type="text/javascript">

var _ouibounce = ouibounce(document.getElementById('ouibounce-modal'), {
  aggressive: false, cookieExpire:5,
  timer: 60000,
  delay: 1000,
  callback: function() { console.log('ouibounce fired!'); }
});

$('body').on('click', function() {
  $('#ouibounce-modal').hide();
});

$('#ouibounce-modal .modal-footer').on('click', function() {
  $('#ouibounce-modal').hide();
});

$('#ouibounce-modal .modal').on('click', function(e) {
  e.stopPropagation();
});

</script>


Thanks!
Paul
#1377318 by Juri from plainlight.com
Sat Jul 22, 2017 11:47 am
Hi Paul,

As I understand it, your current settings should result in

  • popup waiting for one minute on every page [timer: 60000]
  • then for one second in the top area [delay: 1000]
  • once appeared, it should wait [aggressive: false] for five days [cookieExpire: 5] to start over again, from the top of the list
Kind regards,
J.
#1377319 by Paul from Mollymook Beach, NSW
Sat Jul 22, 2017 12:10 pm
Much appreciated Juri

It looks like we are on track. I may finetune the times but that could work perfectly.

Thanks!
Paul
Similar Topics Statistics Last post
Pop Over for my website
by richard from Deming Fri Oct 07, 2016 2:03 pm
4 Replies
515 Views
by Meg from Ames
Thu Nov 03, 2016 10:39 pm
How can I create a pop-up form with a Donate Button
by colin from East Freetown Sun Oct 23, 2016 6:44 am
3 Replies
603 Views
by Peter from Tungamah
Wed Dec 07, 2016 1:31 am

Users browsing this forum: No registered users and 7 guests