Automatic popup on a web page after a specific delay - javascript

I am making a B2C website for elearning. I want that when users come to the website and they have been on a page for more than x seconds( say more than 15 seconds ) then a popup window opens up and this window will have some kind of a help message, say a message like "Questions ? We can help. Please call us on XXXXXXX or write to us at abc#xyz.com" . The popup will have a simple image in it and a close button on top right.
My question is that how can I achieve this behavior of an automatic popup coming after a specific delay , when the user is on the site. Also, I would like to have this popup on specific pages and not the complete site.
Thanks !

Use setTimeout() function in document.ready() and provide your function to it which generates the pop-up.
For more reference, check out http://www.w3schools.com/js/js_timing.asp

just use javascript setTimeout Function :
$(document).ready(function() {
setTimeout(function() {
yourPopupFunction();
}, 15000));
})

Related

Exit Feedback Popup when someone click on tab "x"

Can someone help me with a JavaScript code to show an exit popup when someone clicks on tab "x" to leave that specific page/or website only. (not asking about intent exit pop up). I need to take the userfeedback on my order form to find out if he is happy with the prices. I want to integrate it with contact form 7. Using wordpress. Asking it after 5 hours of search around web.
Thorough help is appreciated.
You can use the beforeunload event (https://developer.mozilla.org/fr/docs/Web/Events/beforeunload) :
$(window).on('beforeunload', function () {
alert('Exit site')
});
You can use the beforeunload event to show a form
$(window).on('beforeunload', function () {
$('.feedbackform').show();
});
on close of the feedbackform you close the page

Trying to Create a Delayed Pop-up with Lightbox

I'm trying to create a lightbox with Jquery that will open an email collection pop-up to sign up for a newsletter. I think I understand how to make it work if someone clicks on a link but I don't want the visitor to have to click a link, I want it to pop up automatically after say a 5 second delay when the visitor lands on the page as seems common on many pages. This is a non CMS page. Can someone tell me the simplest way to go about this?
You can use setTimout() for that :
setTimeout(function(){
//This code will run in 5 seconds
}, 5000);
Here's a fiddle with an alert to demonstrate.
So to do this add this code:
setTimeout(function(){ popupFunction(); }, 5000);
to your jquery window ready event:
$(document).ready(function() {
//add code here
setTimeout(function(){ popupFunction(); }, 5000);
});
And then create a function that makes your popup work:
function popupFunction(){
//code here that works the popup
}

Javascript triggers effect even on site builder page

I think I need a little help here.
I'm doing my company's website through a site builder and I'm planning to add a short alert box every time you first visit the company website. So I added this:
<script>
alert ("Welcome to COMPANY NAME HERE");
</script>
But, after saving my changes in the content of that page...the JavaScript alert box was triggered even though I'm not on my company's website.
I would like that alert box to be only triggered only upon visiting the company website.
Can you guys help me with this?
I would really appreciate the answers :)
Probably want to invoke the alert on ready so try:
(function() {
if ( window.location.href == "www.yourdomain.com" ) {
alert("Welcome to COMPANY NAME HERE");
}
}());

PhantomJS executing JavaScript in a popup for data extraction

So I have a web page with some photos of people. When you click on a photo of the person the JavaScript is executed and produces a popup with some more detailed information such as a description etc.
The link for each photo is as follows:
First I want to start with the basics, of just extracting the description etc. from one single person. So I want to execute the JavaScript above to write the popup window, and when I'm on the popup window I can then extract the content of the div's on the popup.
I've looked at PhantomJS and I really don't know where to start. I've used Cheerio to get some simple information from the page, and I want to move on to executing the popup window through JS and then extracting data from that.
Any help would be appreciated as I'm a bit of a newbie to screen scraping in general.
You can do this analogous to how CasperJS does it.
page.open(yourUrl, function(success){
// mainPage is loaded, so every next page could be a popup
page.onPageCreated = function onPageCreated(popupPage) {
popupPage.onLoadFinished = function onLoadFinished() {
popupPage.evaluate(function(){
// do something in popup page context like extracting data
});
};
};
// click to trigger the popup
page.evaluate(function(){
document.querySelector("a.seeMore").click();
// or something from here: http://stackoverflow.com/questions/15739263/phantomjs-click-an-element
});
});
Do not forget to overwrite/nullify page.onPageCreated before navigating away from the main page.

setTimeout alert with a link hyperlink in it? coupon message pop up after 30 seconds

Is there any way to make the link in this setTimeout alert clickable? I'm just trying to give visitors to my website 5% OFF link after spending 30 seconds on my website but I need the link to be clickable if possible.
<script type = "text/javascript">
setTimeout(function(){alert("Get 5% OFF at: mysite.com/5-OFF ")},30000);
</script>
I don't have to accomplish this by setTimeout but I don't know of any other way. Any help or suggestions much appreciated. Here I seem to always get the best.
Use a UI Widget from one of the many widget libraries for this. Modern websites should not use the javascript alert anywhere , but perhaps for testing(maybe).
Unfortunately you can only display text in the alert function. If you want to put in a URL, you can do it by using jQuery UI's dialog or Twitter Bootstrap's modal window (for example).
EDITED TO INCLUDE ANSWER TO YOUR QUESTION
Something along the lines of:
setTimeout(function() { $( "ELEMENT" ).dialog( "open" ); }, 30000);

Categories

Resources