fancybox

Permalink
I added the following code to my default.php in the head section

<script>
      !window.jQuery && document.write('<script src="<?=$this->getThemePath()?>/js/fancybox/jquery-1.4.3.min.js"><\/script>');
   </script>
   <script type="text/javascript" src="<?=$this->getThemePath()?>/js/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="<?=$this->getThemePath()?>/js/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
   <script type="text/javascript">
      $(document).ready(function() {
         $("a#example1").fancybox();
      });
   </script>



and then added the following to a html block

<a id="example1" href="http://www.mysite.co.uk/files/7513/1853/2352/1_b.jpg"><img alt="example1" src="http://www.mysite.co.uk/files/6613/1853/2365/1_s.jpg" /></a>


but when clicking on the image it just ends up at the bottom of the page under the footer. Have I missed something please help

Responsive
 
ChristiaanB replied on at Permalink Best Answer Reply
ChristiaanB
Isn't it because you forgot to link to the CSS?

It ends up in the bottom of the page because fancybox adds a div to end of the body tag.
Responsive replied on at Permalink Reply
Responsive
thanks Christian I missed the CSS file . working now
Responsive replied on at Permalink Reply
Responsive
Just noticed one problem that the pop up window does not have the x icon to close it. As the window shows correctly i think its an issue in the jquery.fancybox-1.3.4.css when displaying the images.

I have changed the url links in the css to
background-image: url(http://www.mysite.co.uk/themes/windoze/fancybox/fancybox-x.png);


but its still not showing. The jquery.fancybox-1.3.4.css sits in the fancybox folder. any ideas

thanks
pvernaglia replied on at Permalink Reply
pvernaglia
http://www.concrete5.org/marketplace/addons/pug-gallery-and-popup-utility/