Questions tagged [magnific-popup]
Magnific Popup is a responsive lightbox & dialog script with focus on performance and providing best experience for user with any device (for jQuery or Zepto.js).
716
questions
0
votes
0
answers
15
views
How can I show more than one picture on the screen in Magnific Popup gallery?
I have added Magnific Popup gallery in the web page, it works. But it is necessary to show more than one picture on the screen in that gallery. It must be a big picture in the center and halfs of next ...
1
vote
1
answer
84
views
Magnific Popup: How to modify showCloseBtn and closeOnBgClick while open?
Is there a way to edit an open instance of a magnific popup? In one state I want the popup to be closable, and in another state I want to block user from closing. It seems these options are only ...
0
votes
0
answers
11
views
Magnific Popup Image Loading
I've got 4 galleries set up with 5 images in each. When I Popup a gallery, I get the last image stored for that gallery. I can left arrow back through the images. Right click goes to 1st image in next ...
0
votes
0
answers
38
views
Magnific Popup video is still playing even when I click off
I have a video popup using magnific. I implemented the below tutorial.
https://www.solodev.com/blog/web-design/how-to-add-pop-up-video-into-a-website.stml
The popup works great but when I click out of ...
1
vote
1
answer
58
views
How to use the same iframe script with multiple sources?
First of all I'm a total noob so code might be harsh.
With that said, I have a page with several images (thumbnails) that I want to make clickable so that they enlarge and display their own embedded ...
0
votes
0
answers
44
views
Magnific pop up with title and caption next to image
I'm using Magnific Pop Up for my portfolio website. I'd like to add a multi-line caption in addition to the title, including the location, year and type of service provided for each project, and even ...
1
vote
0
answers
29
views
Rails 6 webpacker problem importing magnific-popup package
Im using rails 6 and webpacker.
Im trying to use a js lib called magnific popup.
yarn add magnific-popup
It relies on jquery so I added to my environment.js :
const { environment } = require('@rails/...
0
votes
0
answers
26
views
How to add loop feature for a Magnific popup video .mp4
I am trying to display a video .mp4 using magnific popup, I need to add the loop feature to it.
How is it possible ?
$('.teaser').magnificPopup({
items: {
src: 'video/...
0
votes
0
answers
126
views
how to display mp4 video using magnific popup plugin
I am trying to use Magnific Popup to display a video when I click on an image, but it asks to download instead of playing, even if I use iframe.
<div class="col-md-3" id="item-rotate&...
0
votes
0
answers
61
views
How to automatically close a modal when a YouTube Video ends on a HTML website?
How can I make a magnific popup to auto close when a YouTube Video ends?
$(function() {
$('.popup-youtube, .popup-vimeo').magnificPopup({
type: 'iframe',
mainClass: 'mfp-fade',
...
0
votes
1
answer
88
views
how to print popup.html window contents with javascript?
We have a Chrome extension and we'd like to print the contents of the popup.html.
Does anyone know how I can print this with javascript?
THANK YOU!!!
0
votes
1
answer
70
views
Lazy load for "magnific.popup.js"
Is there a way of initializing the magnific.popup.js after the page loads?
I do not prefer loading it with the rest of the scripts as I only need it, and trigger the popup on a button click.
The ...
0
votes
1
answer
56
views
The form in my pop-pup window fails to submit the inserted data in Laravel
I'm trying to submit data using a pop-pup form but my submit button just closes the windows instead of saving all the data into my data base.
Everything seems to be in order but I have the impression ...
0
votes
0
answers
135
views
How do I integrate slick slider inside the popup of Magnific Popup?
I have a div wrapper with a class of product. Inside this wrapper is a Magnific Popup link that should contain Slick Slider inside the Magnific Popup. Please see the HTML
and JavaScript code below for ...
0
votes
0
answers
116
views
magnific popup image on click to open link on new tab
I am trying to pass a link in the magnific popup, I am showing an image in the popup, what I need is that when the user clicks on the image to open a new tab with the link I am putting.
This is the ...
0
votes
1
answer
567
views
Magnific popup - YouTube - An error occurred. Please try again later. (Playback ID: 0AztKrvPxxy7y8ia)
I'm using magnific popup to embed my YouTube videos on my website. It works like a charm with some videos, but with other videos I get "An error occurred. Please try again later. (Playback ID: ...
0
votes
2
answers
84
views
I am not able to close the first pop up appearing on the website when I land on the website (https://www.seleniumeasy.com/test/)
I'm new to automation and trying to run my code but when I land on the page the first pop up appearing doesn't allow me to process as I'm not able to close this pop-up.
System.setProperty("...
1
vote
1
answer
80
views
Angular, How to get classes by Jquery after getting data from server and *ngFor has been applied for them?
I am using Jquery in Angular with typescript,
I want to get all the classes that have been generated by ngFor loop..
I am building a products site...
I am getting the products from node.JS Server...
...
0
votes
1
answer
253
views
Open magnific popup
I need help to open the popup by using magnific popup.
https://codepen.io/victoreugen2002/pen/poeoKPg
$('#open-popup').on('click', function (e) {
jQuery('#open-popup').magnificPopup({
...
0
votes
0
answers
125
views
Video not autoplaying
I cannot seem to get the video to autoplay I've choose not to use video attribute as I wanted the static image to look nicer before the video is played.
to get the video to play I need to click the ...
0
votes
1
answer
41
views
Add bullets in magnific popup gallery
I have added magnific popup gallery in my web page, everything works great. Just I want to know, is there any possibility add bullets in popup gallery below image in .mfp-bottom-bar.
0
votes
0
answers
23
views
MagnificPopup: associate an item inline at the corresponding element on click
I have the following HTML code:
<section id="tm-section-3" class="tm-section tm-section-carousel">
<div>
<header ...
0
votes
1
answer
172
views
How do you disable magnific popup on mobile devices?
I would like to disable the popup on mobile devices. I found this code in the documentation but I don't understand where to place the code for it to work.
disableOn: function() {
if( $(...
1
vote
1
answer
413
views
Owl Carousel with Magnific Popup - Popup not even displaying, not sure what I'm doing wrong
I'm using Magnific Popup for my Owl Carousel Slider. I just want the images to pop-up on screen. However, it doesn't seem to be working. The only thing it does it when I click the images, it opens up ...
0
votes
1
answer
49
views
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 ...
0
votes
2
answers
699
views
adding magnific popup for youtube video
the window popup but video isn't playing.
it says ''The web page at file://www.youtube.com/embed/Nlw5FnHGER4?autoplay=1 might be temporarily down or it may have moved permanently to a new web address.'...
0
votes
1
answer
726
views
Magnific-popup not working in my WordPress theme page template
I am trying to load magnific-popup in my theme, however it's not working and I am not sure why.
When I click the image it just shows the standard raw image.
When I built this in just html, it worked ...
3
votes
0
answers
158
views
Magnific popup is not functioning when I add hover - text on image
I want to add a text when the user hover the mouse on my image gallery and zoom the when they clicked it. It already zooming in but when I add a class and text between the image class the magnific ...
0
votes
1
answer
2k
views
How to open Youtube video on modal
I need to adjust my code so that the video is played in the modal that is opened when the user clicks on it.
This code was implemented in a modal that was to display images.
I use JS: https://...
1
vote
1
answer
115
views
Magnific Popup issue with mixitup dynamic images
i just setup isotope manually into my website after that i dynamic it with the help of get_terms and get_ther_terms condition here is the full code
<div class="main_page">
<...
0
votes
1
answer
166
views
Pop Up Gallery on HTML / JS displaying all images in same carrousel
Hey everyone so I'm starting to get the hang of HTML, CSS & JS and I'm trying to help a friend out with a small issue he is having with his pop up gallery.
So he currently added 2 main images and ...
0
votes
1
answer
22
views
The image could not be displayed using Magnific Popup
I have the following code and the image popup shows nothing. What am I doing wrong?
$('span.confluence-embedded-file-wrapper').magnificPopup({type: 'image'});
And the HTML code:
<span class="...
0
votes
0
answers
17
views
Trouble with magnific popup [duplicate]
I have trouble with Magnific Pop Up in this site: www.angelesmorgan.com (in thew Portfolio area).
When I try to use the popup the console says:
Uncaught TypeError: $ is not a function
at jquery....
2
votes
1
answer
513
views
Multiple Magnific popup in loop only showing content of last item
I'm using this function to show youtube videos in a lightbox through Magnific Popup. I get the id of .video-youtube links to create a dynamic iframe for any link.
In this page I have 3 different ...
0
votes
1
answer
127
views
Magnific popup html page scroll top problem
I am using magnific popups on my website. When I clicked the image, it calls another (second) html page in popup and it works perfectly.
My problem is, when the popup opens, I want to scroll the ...
0
votes
0
answers
57
views
Can't add HTML (button) to caption
I am using the "Wordpress Carousel Pro" plugin on my Wordpress site. That plugin uses the code from "Magnific Popup" to display a pop-up when you click an image. You can add text to the caption of an ...
1
vote
0
answers
210
views
Why does not click event trigger up to its parent in magnific-popup?
When i click on .mfp-img the event does not trigger up to .mfp-wrap and is stoped in .mfp-container and i can not understand why this is happening.
var clickedImgIndex;
$(".galleryList")....
-1
votes
1
answer
109
views
How to use 'magnific-popup' with Angular
I have implemented the Magnific popup almost successfully here:
https://github.com/orchidea90/Popup
https://orchidea90.github.io/Popup/,
but I need a help with my .ts file. How to make it simpler ...
1
vote
0
answers
19
views
Magnificer Popup uses multiple Slots for the same Picture
the Magnificer Popup works, but when i open a picture and want to scroll to the left or right i need to click multiple times because it initialize
1 picture as multiple. Also the picture count in the ...
0
votes
0
answers
31
views
Ajax popup list in jQuery
I need something like Bootstrap Editable or Bootstrap Confirmation.
But I'm not getting the actual thing that I need.
I need an ajax response when clicked on a button like this,
Here the text ...
0
votes
1
answer
231
views
Magnific Popup fallback image source
How can I use magnific popup with a fallback image format? I want to use webp for all browsers that support it, but jpeg as a fallback. I want to deploy my page on gitlab pages, which is why the ...
2
votes
0
answers
86
views
Magnific Popup AutoLoad on Page Loading... Not Working
I installed this code on a single page PHP page and it works the way I want it to. Problem is page I need to install it on is broken up into 4 PHP pages.(Home.php, which also includes, Header, Menu, ...
0
votes
0
answers
37
views
Using javascript function to launch mignific popup
Good Morning,
I've been scrounging the internet for a solution to the following and have turned up with nothing. The effect I want is for magnific popup to show an image after entering data into an ...
0
votes
1
answer
28
views
Does not have any error but the button does not works
<!DOCTYPE html>
<html>
<head><script type="text/javascript" >
</script>
<!-- jQuery 1.7.2+ or Zepto.js 1.0+ -->
<script src="http://ajax.googleapis.com/ajax/...
0
votes
1
answer
85
views
How to pass value button to another page which is a popup form by alert function?
I want to pass value register at button tag to the another page (popup form). So that, when user click the button and popup form will appear, when user want to fill up the form, they know by alert ...
0
votes
0
answers
37
views
Magnific jquery version update
We love the library and use it extensively as we do Syncfusion. We would love to update to the latest Syncfusion, yet both codebases rely on jquery. In order to upgrade Syncfusion we must upgrade ...
1
vote
1
answer
542
views
magnific-popup basic implementation not working
I am trying to implement the very basic example of magnific-popup ("Single image lightbox" in the official examples) on a page, but I can't get it to to work - when clicking on the thumbnail it just ...
1
vote
0
answers
70
views
magnificPopup used in legend of fieldset doesn't open popup but instead opens in same window
I am trying to use a popup to open an image which is linked behind the legend of a fieldset.
However, the image opens in the same tab, leaving the original page.
<form>
<fieldset>
&...
0
votes
2
answers
960
views
My zoomed magnific modal images have no close button
I'm hoping to use Magnific Popup v1.1.0 to allow users to zoom on images on my webpage. My initial tests seem positive, but I note that there is no close box.
I have downloaded the Magnific Popup css ...
0
votes
1
answer
453
views
Define owl carousel with data attribute in magnific popup callbacks function
I have implement Owl carousel in Magnific Popup. and, It is normaly working fine. if, I have use simple function $('.owl-carousel').owlCarousel({autoplay:true, items:1})
but, Owl carousel does not ...