1

When I try to use the Lightbox2 options code I get an error saying 'lightbox is not defined'. It works fine when I don't add the option code. What is the correct way to implement the options, the website only has this...

lightbox.option({ 'resizeDuration': 200, 'wrapAround': true })

http://lokeshdhakar.com/projects/lightbox2/#options

jk105
  • 95
  • 1
  • 11
  • Show us some more code. I doubt you will get a helpful answer this way. – herzrasen Jul 05 '15 at 20:36
  • There is no more code to show - you don't have to explicitly initialise the lightbox in jquery. Once you include the js script then it automatically initialises it - that's why I'm not sure where the option code is meant to go. – jk105 Jul 06 '15 at 23:09
  • 1
    If you're not using AMD, 'lightbox' is set in the global scope. Make sure to call lightbox.options() after the lightbox.js script tag. – Lokesh Dhakar Jul 09 '15 at 20:45
  • @jk105, Did you solve this issue? I am getting the same error that *lightbox is not defined* and without adding any options to lightbox I am getting this error.. – Jayna Tanawala Dec 31 '20 at 05:13

2 Answers2

4

You can set the lightbox options in the file where you include the lightbox.js file. Also please ensure to include jquery before lightbox.

The code below is inside a block in a php file:

    <body>
        ...
        <script src="js/jquery-1.11.3.min.js"></script> // <-- this is important
        <script src="js/lightbox.js"></script>
        <script>
            lightbox.option({
                'resizeDuration' : 200,
                'wrapAround' : true
            });
        </script>
        ...
    </body>
herzrasen
  • 377
  • 4
  • 13
  • Yes that's what I'm currently doing and I'm getting the 'Uncaught ReferenceError: lightbox is not defined' error in the js console. – jk105 Jul 12 '15 at 23:49
  • Yes I'm including jquery as well. This js error is occurring when I add the 'option' code to the demo that I've downloaded from the website - http://lokeshdhakar.com/projects/lightbox2/#getting-started - do you get this error as well? Thanks for your help BTW – jk105 Jul 15 '15 at 00:58
  • I just downloaded the example from the website and deployed it into my apache. Added the option and it works. I'm using it on a website as well. Can you post the entire html you are using? – herzrasen Jul 15 '15 at 15:37
  • IMHO, the key point here is the you MUST put the options part AFTER the directive. – sbos61 Mar 04 '16 at 17:40
2

Maybe it's a json error. jsonLint says the json string is not valid. It wants the key names to be quoted (with real quote marks, not appostrophes) like this: lightbox.option({ "alwaysShowNavOnTouchDevices" : true, "showImageNumberLabel" : false, "wrapAround" : true }); Interestingly, it works in some browsers with the appostrophes, and even with no quotes at all, so it's apparently implementation dependent, but the "correct" way apparently is to use quotes (").

Pete Hall
  • 21
  • 2