close ad
WARNING: Do Not Install the DREAMWEAVER CC 2017 or 2018 Update »
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Conflict between Powergallery and Fancybox

Thread began 5/25/2016 12:06 pm by Daniel | Last modified 5/27/2016 1:55 am by Ray Borduin | 209 views | 8 replies |

Daniel

Conflict between Powergallery and Fancybox

Hello... I have Powergallery installed on my website and unfortunately it doesn't support video. So to use that capability I would like to use Fancybox. I currently use the code from Powergallery on my website with a variable so that I can just name the gallery on Powergallery and it shows up on my site.

<?php
$pg_id = intval($row_WADAallshows2['comments4']);
$pg_theme = 'wtsa100pixel';
include('/home3/whereth7/public_html/showgallery/galleries/ribbon_lightbox/index.php');
?>

Below that I have the code for Fancybox

</span><a class="fancybox fancybox.iframe" href="https://www.youtube.com/embed/Y-_I-mldTiY" frameborder="0" allowfullscreen"><img src="images/buttons/Book-a-Hotel.png" width="100" height="25" /></a><br>

I load the Fancybox connections above the "head" part of the web page


<!-- Add jQuery library -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<!-- Add fancyBox -->
<link rel="stylesheet" href="js/fancybox/source/jquery.fancybox.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/fancybox/source/jquery.fancybox.pack.js"></script>

I took a look at the index page from Powergallery and I saw that it also loads a different version of js

<?php if(empty($js_mootools)) { ?>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

<script type="text/javascript" src="<?php echo $pg_config['path']; ?>js/mootools-core-1.3.2-full-compat-yc.js"></script>

<script type="text/javascript" src="<?php echo $pg_config['path']; ?>js/mootools-more-1.3.2.1_min.js"></script>

<?php $js_mootools = true; } ?>

I see it also loads mootools

In any case I'm thinking this is where the conflict arises. If I delete the reference from Powergallery from my website then the Fancybox works just fine. How can I get these two to live together peacefully on the same web page?

If there is a way to get Powergallery to support the other types of media... webpages etc I'm all for that too!

Dan Lewis

Attached Files
allshows2_detail-video-2.php
Sign in to reply to this post

Ray BorduinWebAssist

If you can give me FTP access and a URL to reproduce the problem I can take a look. It is probably an issue with conflicting versions of jquery and I can try finding a solution.

Sign in to reply to this post

Daniel

I've made a subdirectory for you to work in...

Hello Ray... I've made a directory for you to work in. www.wheretheshowsare.com/fastsearchvideo

I left off any password protection to make it easier for you.

I've given you the details for the FTP log in in the private part of this message

The Powergallery is actually in two spots... but the one we use is in the sub-directory "showgallery"

I made this www.wheretheshowsare.com directory so we could work this out.

The file that has both the Powergallery code and the Fancybox code is
http://www.wheretheshowsare.com/fastsearchvideo/allshows2_detail.php

The file that has everything except the Powergallery code (and Fancybox works) is
http://www.wheretheshowsare.com/fastsearchvideo/allshows2_detail-no-gallery.php

To access a record where there are images in the Powergallery file you can do a search on the www.wheretheshowsare.com/fastsearchvideo for "Organization" Howard Alan

The button that is connected to a video to test this is the one that says "Book a Hotel" right underneath the images gallery.

I think that gives you what you need... ask if you need anything else

Sign in to reply to this post

Ray BorduinWebAssist

I think it was just the repeated jquery include causing the problems. I fixed the problem by adding this above the gallery code:

$js_jquery=true;

That tells the gallery that the jquery library has already been loaded to the page so it won't load it again.

Sign in to reply to this post

Daniel

Once again you've saved the day!!! Our site is getting so much better because of you!

Thanks Ray... it worked perfectly... I think I've pulled out the rest of my hair though! I've been working on this solution for days!!! Now it opens up the door to video. And of course I've got a couple more projects to tackle so I'm sure I'll be back in touch! Have a great week!

Sign in to reply to this post

Daniel

I spoke too soon... here's another problem with the PowerGallery

I thought everything was working fine... but only when there are no pictures in the Power Gallery. With the change you made Fancybox works fine with the links and all the pictures appear in the thumbnail previews. But when you click on a Power Gallery thumbnail to turn it into a full size picture it works great for a second and then the whole screen (including the picture) turns dark like the background.

Can we solve that problem?

Here is a link to a record that has pictures in it. You'll need to use the username and password I've provided in the private message....

http://www.wheretheshowsare.com/fastsearchvideo/allshows2_detail.php?ID=1713

Sign in to reply to this post

Ray BorduinWebAssist

I updated: /showgallery/css/slimbox/slimbox.css to set the z-index of the image to be above the overlay.

Sign in to reply to this post

Daniel

It's darn close! And it will work....

The solution is pretty good and it works. The only thing it seems to be doing that is unusual is that every time you click through a picture the black screen recycles so we get white, black, white, black as we click through. It's nice when the screen gets dark like that because it forces us to focus on the image being displayed. But in reality I could also live without that feature if I had to. I think it's somewhat distracting as you click through the pictures. Can it be fixed so it behaves like it used to and stays dark until we're finished viewing the pictures?

I know this is being picky... but the good new is that once it's done then I'll be able to use it for quite some time.

Sign in to reply to this post

Ray BorduinWebAssist

It appears the slimbox.js that the powergallery uses isn't compatible with the latest version of JQuery, and the fancybox.js that your page uses isn't compatible with the older version of jquery used by slimbox.

I was able to update .showgallery/js/slimbox.js to fix the problem.

Sign in to reply to this post

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...