Questions tagged [lightbox]

Lightbox, and the newer Lightbox 2, is a JavaScript application used to display large images using modal dialogs.

The script has gained widespread popularity due to its simple, yet elegant, style and easy implementation. While it was initially developed from scratch, Lightbox has since been modified to use a number of JavaScript libraries (such as the Prototype JavaScript Framework and jQuery JavaScript Framework for its animations and positioning), in order to reduce the size of the code. The release of Lightbox encouraged other developers to work on similar projects, resulting in products such as the later Thickbox and lighter Slimbox.

2461 questions
586
votes
23 answers

Prevent body scrolling but allow overlay scrolling

I've been searching for a "lightbox" type solution that allows this but haven't found one yet (please, suggest if you know of any). The behavior I'm trying to recreate is just like what you'd see at Pinterest when clicking on an image. The overlay…
PotatoFro
  • 6,378
  • 4
  • 20
  • 22
133
votes
10 answers

Changing image sizes proportionally using CSS

I have been trying for a couple of days now to configure my thumbnail gallery so all the images appear the same height and width. However, when I change the CSS code to, max-height: 150px; max-width: 200px; width: 120px; height: 120px; I get images…
Lewis
  • 1,945
  • 5
  • 26
  • 52
48
votes
7 answers

Can I load external stylesheets on request?

$.getScript('ajax/test.js', function() { alert('Load was performed.'); }); .. like the above code which loads an external JS on request, is there something similar available to load an external CSS stylesheet when required? Like for example when…
eozzy
  • 66,048
  • 104
  • 272
  • 428
39
votes
4 answers

Removing inherited property of an element (box-sizing)

I am using a jQuery light box plugin on a bootstrap site. It has box-sizing: border-box set via universal selector. * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } The light box div does not…
Gokul Kav
  • 839
  • 1
  • 8
  • 14
38
votes
6 answers

TypeError: $(...).on is not a function

I am using jQuery litebox. After adding JS and CSS files I got this error TypeError: $(...).on is not a function at this line in js file "return $('body').on('click', 'a[rel^=lightbox],…
user1613870
  • 411
  • 1
  • 4
  • 5
38
votes
6 answers

Lightbox to show videos from Youtube and Vimeo?

I'm looking for a lightbox to show videos from Youtube and Vimeo. Any suggestions?
Johan
  • 18,814
  • 30
  • 70
  • 88
35
votes
9 answers

How to fix vh(viewport unit) css in mobile Safari?

I've used vh (viewport units) css in one of my projects but in mobile safari it doesn't work. It seems like Safari doesn't know what to do with vh, but it works fine in other browsers. I would like to make the same effect with or without vh please…
Alvaro
  • 506
  • 1
  • 6
  • 11
18
votes
5 answers

I can't get magnific-popup animations to work

I've been through the excellent documentation for this and it's great. http://dimsemenov.com/plugins/magnific-popup/documentation.html I have the basic pop up working fine. My problem is with the animations. I just can't get them to work. Apologies…
pinkp
  • 445
  • 2
  • 12
  • 30
17
votes
5 answers

Which jquery overlay library is best?

I've used lightbox and fancybox quite a lot but never really seen any reason to choose one over another. There are also a whole bunch I have not used like these http://planetozh.com/projects/lightbox-clones/ . The data on that page is quite old and…
Benbob
  • 13,876
  • 18
  • 79
  • 114
17
votes
3 answers

Simple & small, pure javascript lightbox (dialog overlay)?

Does anyone know of a small, limited functionality lightbox built with pure javascript? This is for an embeddable widget, thus the reason of not using jquery. All I really need is creating an overlay for a specific div or simply by passing some…
user429620
16
votes
3 answers

Using JQuery to open a popup window and print

A while back I created a lightbox plugin using jQuery that would load a url specified in a link into a lightbox. The code is really simple: $('.readmore').each(function(i){ $(this).popup(); }); and the link would look like this:
TJ Kirchner
  • 4,321
  • 6
  • 24
  • 26
14
votes
3 answers

Using jQuery Fancybox or Lightbox to display a contact form

I would like to use jQuery Fancybox or Lightbox to load a contact form from a standard link in a web page. I have reviewed the documents at http://fancybox.net/example but the closest option is the iFrame one and it doesn't work with a standard page…
forrest
  • 10,570
  • 25
  • 70
  • 132
12
votes
1 answer

Using Fancybox with Image map

I wonder if there is a way to use the fancybox with Image maps?
Mohamed Amgad
  • 195
  • 1
  • 2
  • 12
12
votes
7 answers

Is there a VERY light-weight lightbox available?

I'm looking for an extremely light-weight lightbox for jQuery. i'm trying to create my own but i suck and my fist is about to go through the screen.... i'm talking like 5kb or less.. i know it can be done, and if i knew what i was doing i'd do it...…
ExodusNicholas
  • 1,634
  • 5
  • 15
  • 18
12
votes
4 answers

Creating an element that can remove it self?

I'm building a lightbox as a school project, and I can't use jQuery. I've got an image. When you click it, Javascript makes a transparent div with the ID "overlay". I want the div to remove itself, or the parent to remove it but it doesn't work. I…
Sam
  • 133
  • 1
  • 1
  • 4
1
2 3
99 100