JQuery :: Fancybox Links Within A Jshowoff Slide Causing Fancybox To Stop Working?
Oct 17, 2010
I've been working on a freelance design site, and I have been using jshowoff and fancybox on my portfolio page. The portfolio has multiple sections that are set to be scrolled through using jshowoff by using the slide links. This use of jshowoff is working perfectly fine, but fancybox isn't. fancybox is supposed to be set to launch a modal when any of the portfolio thumbnail images are clicked. As it is right now, fancybox links will not work within the jshowoff slide div, but they do work outside of the jshowoff slide div.
I have done about 5 hours of searching online for possible fixed to my issue, and I haven't found anything. I am attempting to fix the conflict the between jshowoff and fancybox. I am very new to using jQuery plugins, so hopefully, you can all bear with me.If anyone may know how I can fix my fancybox links, so that fancybox will work within my jshowoff slide, I'd greatly appreciate it. I have provided the html below:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
[code]....
View 2 Replies
ADVERTISEMENT
Aug 6, 2010
I have a function that dynamically creates links for a photo gallery. The function also produces a larger image as a background image of a div when and thumbnail is clicked on. What I want to do is have a third event, where if the user clicks the enlarged image in the div, the jQuery Fancybox loads an even bigger version of the image being displayed in the div. The problem is that the link for the anchor tag I'm using is created dynamically, and I know that Fancybox parses the HTML when the DOM is ready...unfortunately my function changes the DOM by appending the anchor tag for the full sized image. I need is using the Fancybox's options to specify the href attribute for the plugin.
jQuery:
function gallery(picid, picnum){
var ext = 'jpg';
var fullSize = 'imgs/'+picid+'_full.'+ext;
[Code].....
View 1 Replies
View Related
Mar 20, 2011
I have this simple gallery that loads images from an xml file and usesFancyboxto display the images. Demo Everything is working but the last image is not working with fancybox. The last image just displays in it's own window.
[Code]...
View 10 Replies
View Related
Jan 17, 2011
You can see that when selecting 'Contact' from the top navigation a light-box (fancybox) with a contact form opens, this form can be filled and when the submit button is pressed the content of the form is emailed to myself. However.... The 'Thank you message' is not appearing in the light-box as I would like it to and I cannot work out how to do this.
View 2 Replies
View Related
Mar 20, 2011
This is a follow on from another problem I had with the same image gallery
I have this simple gallery that loads images from an xml file and uses Fancybox - Fancybox - Fancy lightbox alternative to display the images.
untitled
Everything is working but the last image is not working with fancybox. The last image just displays in it's own window.[code]...
View 1 Replies
View Related
Oct 17, 2011
I have a gallery on my site here:
[URL]
add a caption to the bottom of the images when they are clicked on and perhaps even a link?
View 2 Replies
View Related
Oct 4, 2010
My website [URL] works well in Firefox and Safari. But some of the JQuery function doesn't work in IE, e.g., Fancybox.
View 1 Replies
View Related
Dec 1, 2011
I've managed to open the login form in fancybox. When visitors login, the page opens in the i-frame itself. When they hit the close button of the fancy box, the parent page refreshes.Almost there but I would like to close the popup and refresh the parent page at one go with a proper function when a visitor hits the submit button
View 1 Replies
View Related
May 23, 2011
I use the fancybox plugin. I need the plugin with two setups (CSS and plugin itself changed a little) so I duplicated the script and made my changes to it. Now I want to use both script in the same page. Of course there is a conflict with function name, which is why I want to rename the function name of the one script to .fancybox2. But I can't seem to get it to work. I don't know which parts of the fancybox.js file I have to change. There are so many fn.fancybox's. I tried to change them all but it's not working. Any advise how this has to be done?
View 1 Replies
View Related
Nov 26, 2010
So I have a script that retrieves images from Flickr and displays them on my site. I have Fancybox so that when a user clicks on the image, the picture will come up in a... "fancy box"... everything seems correct, but when I click on the image, it sends the user to the location of the picture on Flickr servers instead of opening it using Fancybox.
Here is the code for the Flickr retrieving...
<script type="text/javascript">
var FLICKR_ID = '41313008@N08';
var THUMBNAIL_HTML = '<a id="single" href="%IMAGE_URL%" title="%IMAGE_TITLE%"><img alt="%IMAGE_TITLE%" src="%THUMBNAIL_URL%" /></a>';
function displayImages(data){
var htmlString = "";
$.each(data.items, function(i,item){
var thumbnail = (item.media.m).replace("_m.jpg", "_s.jpg");
var large = (item.media.m).replace("_m.jpg", ".jpg");
htmlString += THUMBNAIL_HTML;
htmlString = htmlString.replace(/%IMAGE_TITLE%/g, item.title);
htmlString = htmlString.replace(/%IMAGE_URL%/g, large);
htmlString = htmlString.replace(/%THUMBNAIL_URL%/g, thumbnail);
});
$('#gallery').html(htmlString);
}
$.getJSON("[URL]", displayImages);
</script>
<a id="single" is the id that goes to open the image in Fancybox. When I disable this Flickr script, and input an image manually, it works 100%.
View 3 Replies
View Related
May 24, 2010
I'm using the most basic functionality of the Fancybox plugin. All renders fine in FF 3.5.9 & Chrome 4. Wouldn't you know it, IE 7 has a problem, it does not display the close box and doesn't honor the location of the title. You can see the problem here: [URL]
Click the Players tab and then click any thumbnail.
View 2 Replies
View Related
Nov 3, 2011
Somehow I can't get this to work on that page: [URL]...
View 2 Replies
View Related
Feb 18, 2010
I have the following problem: In wordpress I wanted to popup the login-page (wp-login.php) and i used the fancybox to generate an iframe. after clicking the "login" button i want that the fancybox is closing (thats not the problem) and i want to reload the whole page so that it recognizes that i'm logged in.
Now that is the problem .. I cant reload the index page when clicking the login button, because (i think so) the login document is in a iframe and is not able to reload the whole screen). I don't know the "reload" command, too, maybe load("index.php"); ? :D
View 2 Replies
View Related
Jun 10, 2011
I did a search of the forums, and this was the only thing I could come up that seems similar: [URL]. The last post in this thread tells me what I already know from my other research today - this function doesn't work in FF, Safari, etc.
Here's my code:
Code:
<script type='text/javascript'> window.onload = function()
{ setTimeout(function()
{ document.getElementById('popupLink').click();
}, $timeleft); }; </script>
Works great in IE, but nothing else. I'm using a jQuery gallery tool called fancybox, and from what I can gather, the popup of the gallery must be tied to a click on an anchor link.
On their support forums, one of their admins suggested that I use the following:
Code:
<script type='javascript'>setTimeout( function() {$
('#popupLink').trigger('click'); }, $timeleft);</script>
Still doesn't work (not even in IE). BTW, $timeleft is a var that is being created in PHP. I've checked the source code and it is counting down correctly.
View 3 Replies
View Related
Oct 28, 2011
I find that either of these plugins work in isolation but together they are clashing. The first to be specified in my initialisation code works, the following doesn't. Initialisation code looks like this:
// remap jQuery to $
// jQuery.noConflict();
(function($){
// Infinite Carousel
$('#carousel').infiniteCarousel({
'transitionSpeed' : 2000,
'displayTime' : 10000,
'textholderHeight' : .25,
'displayProgressBar' : 0
});
// Lightbox
$("a.lightbox").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 600,
'speedOut' : 200,
'overlayShow' : true,
'titleShow' : false
});
})(this.jQuery);
Web pages:
Carousel working: [URL]
Fancybox not working: [URL]
View 8 Replies
View Related
Apr 11, 2011
I'm using the JQuery validation plugin inside a Fancybox window. My contact form appears in the modal popup when the user clicks a link (loaded through an external .html file with the form code), but my problem is that the validation is always skipped and the form is always submitted.The weirdest thing is it works if I put an "alert('...');" before the validation code
[Code]...
View 1 Replies
View Related
May 2, 2011
I have a page that contains images, and those images are displayed in a fancybox window when they are clicked. Some of these images are loaded dynamically after the page loads via AJAX.
All of the images exist inside of link tags with class="challenge_image_gallery". The code works the way it should on the images that are initially loaded on the page. However, when the new images are loaded onto the page using AJAX, the fancybox window loads two instances of the image that was clicked on rather than one as it should.
Here's the code I'm using:
View 8 Replies
View Related
Feb 15, 2011
I have a drop down box. onChange of that drop down box the option selected is $_POSTed to a php page where I'm grabbing that name and using it in a form on the new page.
Instead of it opening a new window for the php page, I'd love to make it more aesthetically pleasing and use Fancy Box and jQuery to open a popup window over the page that has an iframe of the php in it.
My issue: I can't figure out how to have the modal popup open when the dropdown is selected. I don't want to have to use a button to trigger it. Any way to trigger the popup AND also POST to the php page onChange of the selection box?
View 1 Replies
View Related
Nov 5, 2011
FancyBox won't load here. Checked the paths all looks good, click the Cafe Icon.
View 19 Replies
View Related
Sep 25, 2009
i have a site that uses a lightbox based image viewer and the jeditable plugin. basically my site has a photo gallery and below each gallery i have the option to set a caption to the photo.
i have done the caption using jeditable and i've also tried using the ajaxForm plugin for jquery to see if jeditable caused the problem. but whichever method i use, approximately 20% of the time a photo caption is submitted, if you then click on the photo to view full size using lightbox (so far i've used fancyBox, prettyPhoto and Lightbox itself, and all break in the same way) it gets stuck at "loading", whereby the overlay appears, the inital empty box and animated gif appear, but then it just spins forever and never loads the image, as if it cant access the URL. weirder still, the FIRST time i do a page refresh to try and fix the problem, it doesnt work (something in the cache i expect), but if i do a second refresh or a shift + refresh, it resets and works again. it's very difficult to eliminate all variables because the problem is so sporadic, but it seems that the most likely way of breaking lightbox is to do the following:
[Code]...
View 3 Replies
View Related
May 17, 2011
Is there a way to force Fancybox to re-size after the Validation plugin returns an error message?
I have been trying to insert this into the process, but I cannot seem to get it work.
$.fancybox.resize;
View 1 Replies
View Related
Aug 18, 2010
I have a form which open in a jQuery Fancybox Window. The fancybox window opens automatically when the page loads. When it loads, I would like it to set focus on the username field in the form in the Fancybox window. I have found that this must be done when fancybox is envoked, thus I have tried the below code which does not work :
<script type="text/javascript">
jQuery(document).ready(function() {
$("#hidden_link").trigger('click');
document.getElementById('login_form.username').focus();
});
</script>
The form name is "login_form" and the field name is "username".
View 2 Replies
View Related
Aug 19, 2011
I have a page that loads a fancybox popup and it works perfectly with the cookie for setting ho many days to show. the problem i have is that i need it to show 1 every 24 hours over a 3 day period. once the 3rd day is over and the user sees the window for the 3rd day i need a cookie set to never show the window again. here is my code as it sits now. I have worked with this for a couple of days on and off and it is above my head for sure.
[Code]...
View 1 Replies
View Related
Aug 30, 2010
I am working on building a page at [URL]. As you can see I have several DIVs made to look like coupons. I would like to invoke fancybox when one of these coupon divs is clicked. Fancybox would load some html displaying the full details of the coupon and would have a button to allow you to print it. The html for the fancybox could either be an inline hidden div or pulled via ajax but I am unclear on how I could get fancybox to fire when I click on a div rather than on a link. I know that what I have is not correct because without the href I am not sure how to specify what to launch.
View 2 Replies
View Related
Nov 22, 2011
I want to create a gallery of images with a fancybox-esque style but incorporate the "folder functionality" that this site has: [URL] In other words: When I click on an image I want it to expand to "fullscreen". (This I can manage with fancybox.) What I can't work out how to do is display more images from the same photo-session at the bottom of the fullscreen.
View 1 Replies
View Related
Aug 31, 2011
I'm using Gravity forms for a fancybox popup here- hit the 'JOIN' button and you'll see the popup. What I need to do is close the popup when the submit button is hit and then redirect the parent page to a specific url. I cannot wrap the submit button itself in a link because I'm using Gravity Forms. Is there another way to do this?
View 2 Replies
View Related
