You are not logged in.

Announcement

Forum database was corrupt and an old backup was restored as temporary replacement. Registrations closed until the database is recovered. Please ask questions using the Contact form

#1 05-01-2014 16:05:24

Jack
Contributors
Registered: 26-10-2013
Posts: 6

Lightbox Syntax

Hello!

Fairly simple one to answer I hope!

What is the syntax for using the lightbox plugin that comes packaged with Metro UI?

Or can I use another lightbox script?

Does anyone have an experience with any of these?

Thank you

Offline

#2 05-01-2014 19:36:28

steebchen
Contributors
From: Germany
Registered: 03-05-2013
Posts: 121

Re: Lightbox Syntax

Hi, didn't even know this was included, but I think it's copied from leandrovieira, there are some tutorials.

Offline

#3 07-01-2014 00:32:00

Jack
Contributors
Registered: 26-10-2013
Posts: 6

Re: Lightbox Syntax

Okay - i'm getting there - but I have a question - why, when I link to the lightbox.js files in the head of my site does it cause all content to stop displaying?

http://pixxl.us/demo3/#!/url=gallery.php for example.. if i remove the lightbox.js files from my server(but leave the code) the site displays fine...

Offline

#4 07-01-2014 14:00:59

chrismaliszewski
Contributors
From: Torun, Poland
Registered: 06-05-2013
Posts: 246
Website

Re: Lightbox Syntax

It destroys your page bacause jQuery stops working because of incompatibility of jquery from lightbox you downloaded with jquery added as default to this template.
Lines in you website code:

<script type="text/javascript" src="js/jquery.1.2.3.js"></script>
<script type="text/javascript" src="js/jquery.lightbox.min.js"></script>

Did you try to use only jquery.js added to template and js/jquery.lightbox.min.js file? Did lightbox worked?

What is more you use lightbox plugin downloaded from page you mentioned and lightbox plugin which is already added to this template. I think this also can be the problem (but it may not also, I don't know). Move catalogue plugins/lightbox/ to other direction than plugins/ and try your code.

If after small tips I wrote your page still doesn't work, please describe what you did from the beginning while trying to run external lightbox plugin so will try to find a point where sth is wrong smile.

Many information about "how to you lightbox plugin in this template" you can find e.g. here.

Last edited by chrismaliszewski (07-01-2014 14:10:16)

Offline

#5 09-01-2014 22:51:22

chrisly
Contributors
From: Germany
Registered: 05-05-2013
Posts: 80
Website

Re: Lightbox Syntax

hey Jack,

here was a discussion over lightboxes. maybe it will help you.
http://metro-webdesign.info/forum/viewtopic.php?id=122

also

http://metro-webdesign.info/forum/viewtopic.php?id=145

can help smile

Last edited by chrisly (09-01-2014 23:04:48)

Offline

#6 09-01-2014 23:07:39

Thomas
Administrator
Registered: 10-03-2013
Posts: 897

Re: Lightbox Syntax

I think the lightbox plugin has changed since then. (it has changed a few times in fact tongue )

Anyway: did you try this (it's on the site  steebchen mentioned):
Part 2 - Activate

You don´t need to modify your HTML markup to use jQuery lightBox plugin. Just use the power and flexibility of jQuery´s selector and create a set of related images.

The only necessity is to have a HTML markup likes it:

<a href="image1.jpg"><img src="thumb_image1.jpg" width="72" height="72" alt="" /></a>
After it, select the links and call the jQuery lightBox plugin. See some examples:

<script type="text/javascript">
$(function() {
    // Use this example, or...
    $('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
    // This, or...
    $('#gallery a').lightBox(); // Select all links in object with gallery ID
    // This, or...
    $('a.lightbox').lightBox(); // Select all links with lightbox class
    // This, or...
    $('a').lightBox(); // Select all links in the page
    // ... The possibility are many. Use your creative or choose one in the examples above
});
</script>

Offline

#7 27-02-2014 23:30:54

vanderaatje
Contributors
From: The Netherlands
Registered: 20-02-2014
Posts: 17
Website

Re: Lightbox Syntax

i'm still not understanding how to call lightbox for multiple images

I use on a tile:

$tile[] = array("type"=>"slidefx","group"=>1,"x"=>1,"y"=>0,'width'=>2,'height'=>1,"background"=>"#333","url"=>"external:img/vis.jpeg",
    "text"=>"Vakantie Dubai","img"=>"img/vis_300x150.png","classes"=>"lightbox roundedCorners");

This is working for one image but how can I get it to work that if you click the tile you get more images in the lightbox?

Offline

Board footer

Powered by FluxBB