jquery fancybox doesn't run in a script - JavaScript and AJAX forum at WebmasterWorld - WebmasterWorld

Forum Moderators: open

Message Too Old, No Replies

jquery fancybox doesn't run in a script

Uzil

3:05 pm on Jan 25, 2013 (gmt 0)

10+ Year Member

Several times i've faced this issue, but have always been able to go around without realising the real motive. Not this time, I need help.

In a simple html the fancybox works fine with the following code:

<!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">

<script type="text/javascript" src="java/fancybox/lib/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="java/fancybox/source/jquery.fancybox.js?v=2.1.4"></script>
<link rel="stylesheet" type="text/css" href="java/fancybox/source/jquery.fancybox.css?v=2.1.4" media="screen" />

<script type="text/javascript">
 $(document).ready(function() {
 $('.fancybox').fancybox();
});
</script>

<a class="fancybox" href="0311205054102_3.jpg" data-fancybox-group="gallery" title="This is my title"><img style=" border: solid 1px silver; padding: 4px;height:80px;" src="0311205054102_3.jpg" alt="" /></a>

<a class="fancybox" href="0311205054102_4.jpg" data-fancybox-group="gallery" title="This is my title"><img style=" border: solid 1px silver; padding: 4px;height:80px;" src="0311205054102_4.jpg" alt="" /></a>

</body>

</html>

But when the fancybox is called from a Perl script, with the following code, it opens the images in a _blank target:

#!/usr/bin/perl
print "Content-type: text/html\n\n";

print qq(

HERE GOES THE HTML CODE ABOVE


);

Why and what might be jumming the code?

Fotiman

3:37 pm on Jan 25, 2013 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Top Contributors Of The Month

What does the GENERATED output of the perl script look like? The browser doesn't know anything about what happens server side, you need to examine the HTML output. Do View > Source and see what it looks like.

Uzil

4:13 pm on Jan 25, 2013 (gmt 0)

10+ Year Member

The html output source from the perl script is exactly the same of the html document. That's why i'm intrigued. But there are several javascripts, do not know why, that do not run when in the output of a perl script. As mention before, never really bother to find out why.
Every help is appreciated.

Fotiman

5:28 pm on Jan 25, 2013 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Top Contributors Of The Month

My only guess, then, is that this perl script runs at a URL that does not match the path of your other page, and that your external script in "java/fancybox/source/jquery.fancybox.js?v=2.1.4" can't be found relative to your URL. Try opening the page with Chrome*, press F12 to open the Developer Tools, then view the Network tab to see if there are any 404s. You might also see JavaScript errors in the console.

* If you don't have or don't want to use Chrome, Firefox has similar Dev tools.

Fotiman

5:30 pm on Jan 25, 2013 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Top Contributors Of The Month

Side note, you're better off specifying those external files as root-relative files. In other words, relative to the root of your web app instead of relative to the current page:

"/path/to/java/fancybox/source/jquery.fancybox.js?v=2.1.4"

Uzil

5:59 pm on Jan 25, 2013 (gmt 0)

10+ Year Member

I've fix it.
The Javescript in my original post should have been:

<script type="text/javascript">
$(document).ready(function() {

$('.fancybox').fancybox();

});
</script>

and it didn't work. I've just eliminate the empty lines between code line, lookink like my first post:

<script type="text/javascript">
$(document).ready(function() {
$('.fancybox').fancybox();
});
</script>

And for my surprise it works. This is something that i never seen, but i realize that i haven't seen much yet.
Did anybody ever faced what i just did, because de html document have the break lines and works, but the copy and past into the perl script, due to those line breaks didn't.

Uzil

6:02 pm on Jan 25, 2013 (gmt 0)

10+ Year Member

Late answer fotiman

I've tryed everything before exposing the issue in the forum, crossbrowser, paths, creating a head and body in the document, everything..... well almost everything

Thank you for you tips