fancybox-2

We are using fancybox2 for displaying images. Everything works well, but when the larger image is displayed in the fancybox, the page behind scrolls to the top. After closing the fancybox the user has to scroll back downwards to the position, where he opened the box. The examples on the fancybox2 Site do not show this behaviour. I could not find out, where is the difference to make this happen. fancyOptions = { type: 'image', closeBtn: false, autoSize: false, scrolling: 'no', type: 'image', padding: [10,10,10,10], beforeLoad: function(){ this.title = getTitle(this); this.href = $(this.element)

I'm not sure how to accomplish what I'm looking to do, which, on starting out, seemed simple. I want to add a 'visited' class to a clicked link before calling the linked content into a fancybox iframe. Fancybox works fine, as long as I leave off the beforeLoad call. When added, the page simply reloads the window, bypassing the Fancybox. I'm not sure whether my beforeLoad function (here called add_visited ) is allowed to use jQuery (as in addClass ), or whether I need to stick to straight javaScript functionality ( element.setAttribute("className", "visited") ). The code pasted here is for

I am using Fancybox v.2.1.2 in Wordpress (not a plugin). In IE7, I have the loading but it does not opening anything at all. Here is my JS code <!-- Add fancyBox main JS and CSS files --> <script type="text/javascript" src="/path/to/fancybox/source/jquery.fancybox.js?v=2.1.2"></script> <link rel="stylesheet" type="text/css" href="/path/to/fancybox/source/jquery.fancybox.css?v=2.1.2" media="screen" /> <script> jQuery(document).ready(function() { jQuery("a.fancybox").fancybox({ padding : 0 }); }); </script> And here is my code in my page : <a href="/path/to/images/P1050615.jpg" class="fancybox"

Hi you probably think this is a dumb question but I am trying to get titles added to fancy box 2. I know very little about javascript but have this at the bottom of my html <script type="text/javascript"> $(document).ready(function() { $(".fancybox").fancybox(); }); </script> AND if I try to add in $(".fancybox") .attr('rel', 'gallery') .fancybox({ beforeLoad: function() { this.title = $(this.element).attr('caption'); } }); I get all sorts of syntax errors. Site is: http://bit.ly/Wan5kr Your current script is : $(document).ready(function() { $(".fancybox").fancybox({ helpers : { title : { type

So I have a gallery of images, and a few links to it. Something like that <a href="/images/1.jpg" rel="1">title</a> <a href="/images/1.jpg" rel="1">link to first image</a> <a href="/images/2.jpg" rel="1">link to second image</a> <a href="/images/3.jpg" rel="1">link to third image</a> This is cause first image to duplicate in fancybox. Like this: http://filebeam.com/2dec41a1820f2525f040424578c4421c.jpg How can I make a multiple links to the same object without duplications? If all links are visible and clickable, then you could create a custom click handler for the first one that opens fancyBox

I have FancyBox on a website that pops up when they visit and has some info inside it. I'd like to add some kind of button that the user can click, and it sets a cookie not to show the message for about a month or so. I'm quite useless when it comes to things like this, so if anyone could walk me though what to do, that would be awesome. Here's what I have so far. At the bottom I've added what I think could be an anchor for the proposed cookie ("noShow"), but I'm not sure if it would work like it is. I've loaded all the jQuery scripts before this for FancyBox, and after those it loads jquery

My Problem is that I have a large gallery, that should not be load completely on first page load. So I load 10 of 50 images and add fancybox to them. When user clicks the next button, the 11th image should be loaded via Ajax and append to gallery container. Problem ist that fancybox stops at the 10th image, because it doesn't know the dynamic load ones. How can I add dynamic loaded images to fancybox2? currently I have this: function loadFancybox() { $('a.lightbox').fancybox({ helpers: { overlay: { css: { 'background': 'rgba(0,0,0,0.8)' } } }, beforeLoad: function() { this.title = $(this