hemn

hemn supports this item

Supported

856 comments found.

Hi,

I recently purchased your awesome plugin (non-wordpress version) and would like to use it with a google map. I know you have an example on your site showing that it can be done. But, do you have any instructions on how to do it? any help would be great!

Thanks, Greg

Purchased – 21 Dec 2016

I’m actually getting a js error when loading:

Uncaught TypeError: Cannot set property ‘speed’ of undefined

Any help would be great!

dont worry about my request. figured it out…

Hello, I purchased this great lightbox code and I’m trying to make it work, but keep running into issues. Here’s what I’m trying to do: -Auto pop-up lightbox upon PAGE LOAD with auto play and auto close -video sourced from vimeo -no link or thumbnail on the site – just a standalone popup that appears and then disappears when finished -I have checked the FAQ section on your website and also searched the comments here and found some code you recommended to accomplish what I want, but I cannot seem to get it to work.

Here is the code I have on the webpage:

<!- iLightbox -> <script type=”text/javascript” src=”https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js”></script> <script type=”text/javascript” src=”assets/src/js/jquery.requestAnimationFrame.js”></script> <script type=”text/javascript” src=”assets/src/js/jquery.mousewheel.js”></script> <script type=”text/javascript” src=”assets/src/js/ilightbox.packed.js”></script> <script type=”text/javascript” src=”assets/src/js/froogaloop.min.js”></script>

<link rel=”stylesheet” type=”text/css” href=”assets/src/css/ilightbox.css”/>

</head>

<body class=”site-left”>

<script> jQuery(window).load(function(){ jQuery.iLightBox(‘http://player.vimeo.com/video/207024629?api=1', { callback: { onShow: function(api){ var iframe = $(‘iframe’, api.currentElement)[0], player = $f(iframe); }); </script>

// When the player is ready, add listeners for pause, finish, and playProgress
            player.addEvent('ready', function() {
                player.addEvent('finish',  function() {
                    api.hide();
                });
            });
        }
    }
});

Please advise. Thank you.

hemn

hemn Author

Use below code instead your current code:
<script src="https://player.vimeo.com/api/player.js"></script>
<script>
jQuery(window).load(function(){
    jQuery.iLightBox('https://player.vimeo.com/video/207024629?autoplay=1&color=000000&title=0&byline=0&portrait=0&api=1', {
        callback: {
            onShow: function(api){
                var iframe = $('iframe', api.currentElement)[0],
                    player = new Vimeo.Player(iframe);

                player.on('ended',  function() {
                    api.hide();
                });
            }
        }
    });
});
</script>

Warm Regards

Thank you for the adjusted code. However, it still does not close automatically when the video ends. See test page: http://www.headroomfordays.com/indextest.html

Does it have anything to do with this file: froogaloop.min.js ? I got it from one of the previous support threads, but perhaps there’s something outdated in it. Please advise. Thank you.

Hi there, It is possible to displayed only the first three images from a gallery and with a “load more” function then the rest?

Thanks for the feedback,regards

Hi,
Thanks for your interest in iLightBox.

Yes, but you need to refresh iLightBox after load more content.

Warm Regards

I like to use your awesome lightbox with picturefill, which is also awesome. So my code looks like this, It works great, but of course your plugin just load the image I provide. Is it possible to implement better picturefill?

https://scottjehl.github.io/picturefill/

<picture> <!-[if IE 9]><video style=”display: none;”><![endif]-> <source srcset=”examples/images/extralarge.jpg” media=”(min-width: 1000px)”> <source srcset=”examples/images/large.jpg” media=”(min-width: 800px)”> <!-[if IE 9]></video><![endif]-> </picture>

Hi,
Thanks for using iLightBox.

Right now there is no better way to picturefill, but we will add picturefill support in the next major version.

Warm Regards

Hello! Tell me, please, can I customize the left area using your plugin? For example, as in the picture?

https://cloud.mail.ru/public/4ezv/dxcBFDShh
hemn

hemn Author

Hi,
Thanks for your interest in iLightBox.

Yes, you can do that, but you need to do some code to fully customize that with iLightBox.

Warm Regards

Hello Hemn, I found the code have “ilightbox.net/getSource/jsonp.php” Can I get the php source? If need any fee ,please let me know~

Hi, I am really worried about maybe someday “ilightbox.net” stop service~

Hello? I wait for your answer for a long time~ If one day , ilightbox.net/getSource/jsonp.php stop service or get any error, iLightBox will be affected. There are more 4000 people bought your script. They will be affected,too.

hemn

hemn Author

Excuse me for my late. ilightbox.net will not stop service and we have plans for it. But if you want it just contact me via my profile.

iLightBox ready for translation in po/pot file? I want to buy, but I need a translation settings in admin panel.

hemn

hemn Author

Hi,
Thanks for your interest in iLightBox.

Unfortunately iLightBox not optimized for translation.

Warm Regards

planned ?

hemn

hemn Author

Yes, of course. It’s will be available in the next version.

Wonderful plugin, really loving it. Only question so far is if there is a simple way to remove the text that is shown on the image once you share it? Example….click the Facebook social icon on an image, visit the page where it’s shared, at the bottom of the image is the URL of the original site with the arrow icon. Since I’m already embedding the URL into the image itself, this duplicity looks a little strange. Is there some code I can add/remove to prevent the text your plugin adds to the linked content?

Thank you! CR

hemn

hemn Author

Hi,
Thanks for using iLightBox.

It’s not coming from iLightBox, it’s just facebook.

Warm Regards

MrMaffi

MrMaffi Purchased

Hi! I have this code in a single page. i have 3 links with 3 video:

div class=”row” a id=”ilightbox” href=”video/video1.mp4” data-options=” html5video: { controls: false,autoplay: true,preload: ‘auto’}” img src=”img/video1.png”/a /div

div class=”row” a id=”ilightbox” href=”video/video2.mp4” data-options=” html5video: { controls: false,autoplay: true,preload: ‘auto’}” img src=”img/video2.png”/a /div

div class=”row” a id=”ilightbox” href=”video/video3.mp4” data-options=” html5video: { controls: false,autoplay: true,preload: ‘auto’}” img src=”img/video3.png /a /div

<script>
     $('#ilightbox').iLightBox();
</script>

The first lightbox works great, the second and the third don’t load the video. Can I work with 3 istance of lightbox in a single page?

Thanks!

hemn

hemn Author

Hi,
Thanks for using iLightBox.

You need to use class name not id. Add ilightbox class to your links and use below code:
$('.ilightbox').each(function(){
  $(this).iLightBox();
});

Warm Regards

Westlir

Westlir Purchased

Hello, I use ilightbox for all images with one class .laod-ilightbox how can make when clicking on an image just open it without getting all images with this class.

hemn

hemn Author

Hi,
Thanks for using iLightBox.

Use below code instead yours:
$('.laod-ilightbox ').each(function(){
$(this).iLightBox();
});

Warm Regards

I have an issue with the plugin. I created galleries in my testing environment and the migrated to my production environment.

It was working fine but I’ve noticed the URLs of images were still pointing to my testing environment so I did a find and replace of all URLs in wp_ilightbox so that all images would point to my production environment.

All galleries were gone after that, I don’t understand why.

How can resolve it? I dony’ want to replace manually all URLs images…

hemn

hemn Author

Hi,
Thanks for using iLightBox.

You need to use latest version and its Import/Export feature.

Warm Regards

Westlir

Westlir Purchased

Last question how can make ilightbox working with infinite scroll? I use the infinite scroll for posts not images and maybe the post contains image when clicking on an image it’s open lightbox but not getting the image just the black screen and close button and full screen button?

hemn

hemn Author

Hi,
Thanks for using iLightBox.

You need to refresh your iLightBox instance every time the new content has been appended by infinite scroll. Like what i did in infinite scroll example.

Warm Regards

Hi,

What’s the best way to disable the scroll on website while iLightbox is open? Thanks!

hemn

hemn Author

Hi,

iLightBox will stop scrolling but if you used mousewheel feature to scroll your page iLightBox cannot stop that. You need to stop mousewheel when iLightBox opened.

Warm Regards

giantspi

giantspi Purchased

Hi I need a little help with the plugin. I have a page with about 30 self-hosted videos, for which I am using my own custom thumbnail for each. Rather than set up 30 ids I am using a class with the each() JS call code that I found in this forum. The problem is the lightbox does not work on an iPhone with the class. If I test it with an id on one thumbnail it works fine on mobile, so I probably have a problem with my JS call. (I am a JS novice only).

My element code:
<a href="xxx.mp4" class="ilightbox" data-type="video" data-title="xxx" data-options="width: 480, height: 360, html5video:{ controls: true, autoplay: true, preload: 'auto' }"><img src="thumb_xxx.jpg" width="130" height="100" /></a>

My JS call:
<script> $('.ilightbox').each(function(){ $(this).iLightBox({ innerToolbar: true, skin: 'dark', controls: { arrows: false, thumbnail: false } }); }); </script>

I would like to use a class, not ids, and need the mobile to work as well.

thanks!

hemn

hemn Author

Hi,
Thanks for using iLightBox.

Try this one:
<script>
var $thumbnails = $('.ilightbox');
$thumbnails.each(function(){
  $(this, $thumbnails).iLightBox({
      innerToolbar: true,
      skin: 'dark',
      controls: {
          arrows: false,
        thumbnail: false
        }
  });
});
</script>

Warm Regards

giantspi

giantspi Purchased

Ok it turns out my issue for the mobile was that the tags needed the “display: block” CSS – which I found somewhere in this forum. Thanks!

A new question: if I remove the each(); iteration then all of the videos are in a group and the arrows can be used to switch between videos – this is nice!

BUT:
1) Since I have autoplay: true set on each element, all of the videos start playing when one video is clicked on. Can I use autoplay on grouped tags but have only the clicked video play?

2) When the user clicks on the arrow to go to the next video inside iLightbox the previous video continues playing. Is there a way to have that previous video automatically stop playing when you click on an arrow in iLightbox to go to the next video in the group?

Element code:
<a href="xxx.mp4" class="ilightbox" style="display: block;" data-type="video" data-title="xxx" data-options="width: 480, height: 360, html5video:{ controls: true, autoplay: true, preload: 'auto' }"><img src="thumb_xxx.jpg" width="130" height="100" /></a>

JS call:
<script> $('.ilightbox').iLightBox({ innerToolbar: true, path: 'horizontal', skin: 'dark', controls: { arrows: true, thumbnail: false, fullscreen: false, slideshow: false } }); </script>
If this might be a large request, let me know how to contact you to hire you for a paid customization.
thanks!

hemn

hemn Author

Hi,
Thanks for using iLightBox.

Video galleries not recommended because there is no way to stop video iframe after slide changed.

Unfortunately there is no way to prevent this. This is just possible for YouTube and Vimeo videos with their API.

Warm Regards

I admit to being “in over my head” when coding, so it’s no surprise that I’m running into an issue. Maybe I’m just overlooking something simple. The iLightbox plug-in runs like a dream in the preview window/local folder, but once put to my live server, iLightbox is gone. I read all of the documentation and made sure that all of the supporting files had been uploaded to my server.

I used to use a god-knows-how-old version of lightbox, and the asset folder for that is still in my Web directory—could that be what’s causing my issue? I’m hesitant to delete that old folder until I’m sure, since once it’s gone, my website is essentially non-functioning until I have a replacement working.

I have a test page live at http://www.elisabethcraster.com/API.html

hemn

hemn Author

Hi,
Thanks for using iLightBox.

There is just one issue. You didn’t include JavaScript & CSS files right. They are not found on your page. Please locate them to exists files on your server.

Warm Regards

Westlir

Westlir Purchased

Hello, Please tell me if you can help me on this, I can’t make ilightbox refresh every time infinite scroll loaded also please be known that I use the infinte scroll for loading WordPress posts, not images so please check this code and tell me what can I do with this:

$(document).ready(function(){ InfinitiScroll = Backbone.View.extend({ el: 'body', initialize : function(){ var view = this; $(window).scroll(function(){ if($(window).scrollTop() == $(document).height() - $(window).height() && $("#post_loading").attr('data-fetch') == 1 ){ view.ajaxData(query_default); } }); var loading = $('body').find('#post_loading'), fetch = $(loading).data('fetch'), type = $(loading).data('type'), term = $(loading).data('term'), taxonomy = $(loading).data('taxonomy'), posts_per_page = $(loading).data('current-page'), sort = $(loading).data('sort'), keyword = $(loading).data('keyword'), /*Added author attribut to support infinity scroll in author page */ author = $(loading).data('author'), query_default = { action : 'et_post_sync', method : 'scroll', data : { posts_per_page : posts_per_page, type : type, term : term, taxonomy : taxonomy, sort : sort, page : 1, keyword : keyword } }; setInterval(function(){ if($('ul#main_questions_list li.question-item').length < 6 && $("#post_loading").attr('data-fetch') == 1){ view.ajaxData(query_default); } }, 3000); }, ajaxData : function(query_default){ var loading = $('body').find('#post_loading'); query_default['data']['page'] += 1; $.ajax({ url : ae_globals.ajaxURL, type : 'post', data : query_default, beforeSend : function(){ $(loading).removeClass('hide'); $(loading).attr('data-fetch',0); }, error : function(){ $(loading).addClass('hide'); $(loading).attr('data-fetch',1); }, success : function (response){ setTimeout(function(){ if(response.success){ var container = $('body').find('#main_questions_list'), questions = response.data.questions; for (key in questions){ $(container).append(questions[key]); } $(loading).addClass('hide'); $(loading).attr('data-fetch',1); }else{ $(loading).addClass('hide'); } },1500); } }); } }); if(ae_globals.is_infinite){ new InfinitiScroll(); } });
hemn

hemn Author

Hi,
Thanks for using iLightBox.

You need to refresh iLightBox instance at the end of the ajaxData success function using iLightBox refresh method. Instructions is available in the documentation.

Warm Regards

by
by
by
by
by
by