I want to pop up a custom designed mail chimp form, like Groupon/Fab etc do upon page load. I have copied the code of the form and now have it as a page on our server, however I am having no luck creating a pop up of the page/form on page load. I have tried shadowbox, bpopup and others with no luck. I can get it to "pop up" on a button push, but the pop up essentially just loads the whole form page instead of raising the port page up, centering it and dimming and locking the background. jquery is not my strong suit so any help would be greatly appreciated. Also, I am not wedded to jquery so if something else like ajax would be quicker for this application than great.
I would try something w/ jQuery's ready() function. http://api.jquery.com/ready/
Related
I have a PHP script (download.php) that receives Form Post data from the index.php page.
The processing takes a while to submit the form thus making the browser loading (the spinning wheel) for quite some long time.
Can I force the browser not to show the gray loading wheel until the form is submitted and the Post page (download.php) is done and ready to display?
For example like Youtube is doing now, they show a progress bar on top but the browser is not loading at all.
To achieve an effect similar to youtube you would need to use AJAX in conjunction with the history.pushState();.
Youtube has released a framework called spfjs for achieving the same effect that their own website has. Take a look at https://youtube.github.io/spfjs/.
If you click submit button and move to download.php, the web browzer will definitely show a loading tab. To avoid this, AJAX can be used.
Once the form data are submitted by means of AJAX, you can also receive back the download.php page contents ready to be displayed using the same AjAX response. Then hide the contents of index.php and place the received html instead. I hope it will work, for I am using this method.
Thank you.
I'm trying to use Bootstrap-Switch to toggle my checkboxes. It works fine on a normal page, or a modal thats pre-loaded into the page.
However, if I load the modal from a remote page (a href=something.html) the toggle does not work/display. Apparently it loads once but doesn't reload after the modal is opened.
I tried
$("#myModal").on("shown.bs.modal",function(){
$(".checkbox").bootstrapSwitch();
});
But to no avail.
I've tried added the JS code directly to the code being pulled from the Modal as well but it didn't work. It worked on the remote page when loaded directly, but not through the Modal.
I'm a novice JS guy so this may be a trivial fix. Basically need to know how to call bootstrapSwitch() after the modal is loaded.
Thanks!
Just realized I had the shown.bs.modal called 2x for different things. When I combined, it fixed it. Bah, 30 minutes down the drain!
Ok, so the most stupid question you're gonna read today is up.
What I wanna do is that if some user of mine visits a page (say. www.mysite.com/whatever), I want to show a Lightbox like pop-up, before the page loads, which takes an input in a text box. When a user enters the text (say, "dawg") and press submit, I wanna then open the page (hopefully without page load) with this variable as a GET. So the URL that'd open be
www.mysite.com/whatever?var=dawg
Lightboxes are itself easy to configure but this specific case is just twisting me. After so much trying, I don't even know how to approach this problem.
Thank you for reading till here.
Best.
You can use location.href="#?var=dawg" and send the ajax call, if you want.
I created a jQuery mobile application using ASP.NET MVC and in the jQuery mobile documentation it's mentioned that Ajax is enabled by default for page transitions on clicking a link or submitting the form.
In my case, when I submit the form,
I get a full page refresh and I don't see the spinning loader.
I get a flash of blank page and then page gets loaded.
My page is similar to a survey page where one question will be displayed with list of options to select and then click Next.
When user clicks Next it submits form and fetches next question via controller. So I am not sure what I am missing.
Please advise
Thanks in advance
You can try out to turn off the page transitions.Jquery mobile is still not very smooth in page transitions.May be that is causing the problem.
$(document).on( "mobileinit", function() {
$.mobile.defaultPageTransition = "none";
});
Please refer
jQuery Mobile flickering screen during transitions
I am trying to replicate a feature of GMail in my own application.
When changing folders in GMail, the display will stay on screen and a small loading banner will appear on the top of the site.
This is desirable, since it prevents the screen from going all white and disturbing the users workflow on postback.
I have tried to disassemble this using Firebug, and I feel that I'm getting close.
The GMail site consists of a 100% sized Iframe which contains the entire interface.
After this frame is a div that contains the loading banner. The div is invisible and is placed behind the Iframe.
What script gets executed that move the banner in front of the Iframe?
Thank you,
Martin Wiboe
GMail is built entirely using AJAX; there are no regular postbacks at all.
It creates a <div> before sending the AJAX request asking for the contents of the folder, then hides the <div> when it receives a reply.
You can easily duplicate it using jQuery.
You can accomplish what you are trying to do with AJAX and a callback handler. On the AJAX post, you will make the loading div visible. On a successful postback, you will hide it.