Before you leave html

sticker

Hi All,

Anyone know how this page works? When you try to go to bookmarks in chrome, this page appears...

https://www.plantation-shutters.co.uk/

S.M.B.

There's some javascript on the page which loads a 'please don't go modal/splashscreen' on moving the mouse cursor out of the page header and into the browser's chrome/UI.

The page uses jQuery so they're probably using the mouse move event to trigger the display.

If you were to paste this into the console you'll see a message is being logged at the same time.

jQuery( "#site_header" ).mousemove(function( event ) {
  var msg = "Handler for .mousemove() called at ";
  msg += event.pageX + ", " + event.pageY;
  if (event.pageY == 0) console.log(msg);
});

sticker

S.M.B. wrote: »

There's some javascript on the page which loads a 'please don't go modal/splashscreen' on moving the mouse cursor out of the page header and into the browser's chrome/UI.

The page uses jQuery so they're probably using the mouse move event to trigger the display.

If you were to paste this into the console you'll see a message is being logged at the same time.

jQuery( "#site_header" ).mousemove(function( event ) {
  var msg = "Handler for .mousemove() called at ";
  msg += event.pageX + ", " + event.pageY;
  if (event.pageY == 0) console.log(msg);
});

Many Thanks.

Not used this before - Any ideas on how I add this code to my html5 website?

S.M.B.

I've no idea if there's some 'out of the box jquery plugin(s)' that could help you out. Otherwise it's code it all from scratch.

bpmurray

Presumably it's using onbeforeunload:

$(window).on('beforeunload', function(){
                  return 'Are you sure you want to leave?';
           });

DaveJoyce

They are Exit Intents, a good example can be found here


https://codepen.io/ashwin9/pen/eJQOeg


I have sued these, trying to get people to sign up to my newsletter, but the conversation rate was look, I used a plugin from HubSpot instead of coding my own, in the end I switched to have a newsletter sign up once the user scrolls 40% of the page (another option on the HubSpot plug in) and I found a better conversation rate




Regards
Dave

sticker wrote: »

Hi All,

Anyone know how this page works? When you try to go to bookmarks in chrome, this page appears...

https://www.plantation-shutters.co.uk/

Baz_

Just for the record, I find them dreadfully annoying, I've not done any research so maybe I'm alone, but I doubt it...

Creamy Goodness

Baz_ wrote: »

Just for the record, I find them dreadfully annoying, I've not done any research so maybe I'm alone, but I doubt it...

you're not alone, anything that fights me as a user against my intended behaviour is a sure fire way for me to not buy your product/sign up to your newsletter/make sure I never visit your site again.

Us developers need to respect ourselves as users first and foremost.

S.M.B.

DaveJoyce wrote: »

They are Exit Intents, a good example can be found here

Ah yes, mouseout/mouseleave could be used on the body.

I agree with others that I'm not a big fan. I could tolerate one triggered on hovering away from the page and into the browsers chrome though. I would not tolerate one triggered using "beforeunload" though.

sticker

Baz_ wrote: »

Just for the record, I find them dreadfully annoying, I've not done any research so maybe I'm alone, but I doubt it...

I agree to be honest!

tricky D

So many newsletter sign ups are poorly designed and executed:

Way too early in the user path, before users get to see if it is worth signing up to.
Too in your face. Should be much more passive and rely much less on popups which mainly annoy and get dispatched.
Poor addressing of privacy concerns etc.
No or poor idea of content and frequency.
No archive so users can see exactly what kind of stuff they get. Also content and SEO boosts available from this.
Not thinking what system of metrics to use and why: quality over quantity. How many of the sign ups are actually useful?
...

all imho

sticker

Thanks for all the contriobutions all... Much appreciated!