magnific-popup

Magnific Popup is a responsive jQuery lightbox plugin that is focused on performance.
19 followers

Magnific-Popup

Magnific Popup is a responsive jQuery lightbox plugin that is focused on performance and providing best experience for user with any device (Zepto.js compatible).

Donation: Pagseguro, PayPal

Requirements

Installation

Link:

<a class="test-popup-link" href="http://farm9.staticflickr.com/8241/8589392310_7b6127e243_b.jpg">Open popup</a>
<?php
$this->widget("ext.magnific-popup.EMagnificPopup", array('target' => '.test-popup-link'));
?>

YouTube:

<a href="www.youtube.com/watch?v=qObzgUfCl28" id="video">YouTube</a>
<?php
$this->widget("ext.magnific-popup.EMagnificPopup", array(
'target' => '#video',
'type' => 'iframe',
));
?>

Gallery - One link:

<a class="test-galery-link" href="http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_b.jpg"><img src="http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_s.jpg" width="75" height="75" /></a>
<?php
$this->widget("ext.magnific-popup.EMagnificPopup", array(
    'target' => '.test-galery-link',
    'options' => array(
        'gallery' => array(
            'enabled' => true,
        ),
        'items' => array(
            array('src' => 'http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_b.jpg'),
            array('src' => 'http://farm9.staticflickr.com/8382/8558295631_0f56c1284f_b.jpg'),
            array('src' => 'http://farm9.staticflickr.com/8225/8558295635_b1c5ce2794_b.jpg'),
            array('src' => 'http://farm9.staticflickr.com/8383/8563475581_df05e9906d_b.jpg'),
            array('src' => 'http://farm9.staticflickr.com/8235/8559402846_8b7f82e05d_b.jpg'),
        ),
    ),
));
?>

Galley - Multiple links:

<?php
$this->beginWidget("ext.magnific-popup.EGalleryMagnificPopup", array(
    'galleryOptions' => array(
        'preload' => array(0, 3)
    ),
));
?>
<a href="http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_b.jpg" title="The Cleaner"><img src="http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_s.jpg" width="75" height="75" /></a>
<a href="http://farm9.staticflickr.com/8382/8558295631_0f56c1284f_b.jpg" title="Winter Dance"><img src="http://farm9.staticflickr.com/8382/8558295631_0f56c1284f_s.jpg" width="75" height="75" /></a>
<a href="http://farm9.staticflickr.com/8225/8558295635_b1c5ce2794_b.jpg" title="The Uninvited Guest"><img src="http://farm9.staticflickr.com/8225/8558295635_b1c5ce2794_s.jpg" width="75" height="75" /></a>
<a href="http://farm9.staticflickr.com/8383/8563475581_df05e9906d_b.jpg" title="Oh no, not again!"><img src="http://farm9.staticflickr.com/8383/8563475581_df05e9906d_s.jpg" width="75" height="75" /></a>
<a href="http://farm9.staticflickr.com/8235/8559402846_8b7f82e05d_b.jpg" title="Swan Lake"><img src="http://farm9.staticflickr.com/8235/8559402846_8b7f82e05d_s.jpg" width="75" height="75" /></a>
<a href="http://farm9.staticflickr.com/8235/8558295467_e89e95e05a_b.jpg" title="The Shake"><img src="http://farm9.staticflickr.com/8235/8558295467_e89e95e05a_s.jpg" width="75" height="75" /></a>
<a href="http://farm9.staticflickr.com/8378/8559402848_9fcd90d20b_b.jpg" title="Who's that, mommy?"><img src="http://farm9.staticflickr.com/8378/8559402848_9fcd90d20b_s.jpg" width="75" height="75" /></a>
<?php $this->endWidget(); ?>

Resources

Total 5 comments

#17443 report it
Sachem at 2014/06/12 08:40am
great job, but little bug in the extension...

First of all, thank you very much for this brilliant extension. Great effort!

Secondly, I think in EGroupMagnificPopup.php, line 12, there should be:

Yii::import($alias . '.EMagnificPopup');

Instead of:

Yii::import($alias . '.EBaseMagnificPopup');

Anyway, great job, cheers!

#15799 report it
noorr_swati at 2013/12/18 08:14am
i have a problem

how can i block a class of links to prevent magnific pop up , please if any one have idea please share.. :)

#15765 report it
noorr_swati at 2013/12/15 12:07pm
goog job..

tnx alot for such a nice effort...

#14885 report it
Rajith R at 2013/09/18 06:36am
@Edgard Messias

good work

Thank you

#14697 report it
trond at 2013/09/04 02:27am
Thanks for sharing

I assume this is the jQuery plugin that can be found here: http://dimsemenov.com/plugins/magnific-popup/. Looks good.

Leave a comment

Please to leave your comment.

Create extension