We Keep Coding

magnific popup: change content programmatically from popup form to modal spinner then back to form

I need to open the first popup with a form, then after the form submission I need to show a modal popup with a spinner and after successful ajax response I need to close the modal and show the same form with either form errors or success string.
The form and spinner work on their own fine. I open the modal before sending the ajax:
var magnificForm = $.magnificPopup.instance;
var magnificSpinner = $.magnificPopup.instance;
magnificForm.open({
...
});
magnificSpinner.open({
type: 'inline',
items: {
src: spinner_img,
},
preloader: false,
modal: true,
});
then on response I close this one:
.done(function(response) {
$.magnificSpinner.close();
...
}
But that close() also closed the first popup. How can I switch from the modal back to the form without re-initializing the whole popup?

Here's how to close the popup:
$.magnificPopup.close();

magnific popup how to open popup via script just like as alert

I have a div with contents to be displayed as popup, however, I am not sure how to open it in a popup using magnific popup script automatically, just like as an alert.
$(function () {
$('.popup-modal').magnificPopup({
type: 'inline',
focus: '#zipCode',
modal: true
});
});
when I fired the div with class "popup-modal" using click event, I am seeing screen with gray color having value rendered as true.

Hide twitter bootstrap popover

Following is my jquery code which i am using to display popover . What i wanna do is when a user click anywhere on the screen or on any <span id="close" class="pover"></span> then it hides the current opened popover and show a new popover on which the user clicks on.
As You can see below span which contains class="pover" are being poped up by the following jquery kindly let me know how can i hide the opened popup and display a new one accordingly
Currently, all the popover are getting displayed on click event.
$(document).ready(function() {
$('.pover').each(function() {
//$('#close').popover( "hide" );
$(this).popover({
title: $(this).attr('abc'),
content: $(this).attr('data-content'),
delay: "show",
trigger: "click"
});
});
});​

Found this great solution:
Exactly what I am seeking to do.
https://github.com/lecar-red/bootstrapx-clickover
http://www.leecarmichael.com/bootstrapx-clickover/examples.html

jQuery plugin SimpleModal body onclick close not working

I'm having problems getting the SimpleModal jQuery plugin to close when the body is clicked. So far, only the 'X' button works to close it with:
$('a.modalCloseImg').hide();
Here is my code for launching the modalbox. Note that #login-link is the link that opens the box and #login-form is the hidden modal box.
// launch modal box
$("#login-link").click(function(){
$("#login-form").modal();
});
I've tried adding
$("#login-form").modal(overlayClose:true);
but it doesn't seem to be working. (FYI that parameter is per the documentation of the SimpleModal box as seen here.

Try launching the modal box with an additional parameter, like this:
// launch modal box
$("#login-link").click(function(){
$("#login-form").modal({ overlayClose: true });
});
you forgot additional {}.

How can I use Simple Modal to scroll to the top of my page just before the modal launches?

I'm successfully using Simple Modal to launch a modal when a button is clicked, however, I want the page to scroll to the top first. I tried placing an anchor tag at the top of the page and referencing it in my link using , but it didn't work. The Simple Modal still worked, but it didn't scroll to the top of the page first. Is there a way to edit the simple modal javascript to make it first scroll to the top of the page before the modal is opened?

use JavaScript before you call your modal: window.scrollTo(0,0)

Use a callback: http://www.ericmmartin.com/projects/simplemodal/#options
$('#modalContent').modal({
onOpen: function () {
$('html, body').scrollTo(0, 0);
}
});