1
votes

I'm having trouble with displaying my images when I upload it on the server, if I preview the website from my DW it shows the images, when I upload it on the server it shows “The requested content cannot be loaded. Please try again later.”

Here is my code :

$(document).ready(function() {
            $("#fancybox-manual-c").click(function() {
                $.fancybox.open([
                    {
                        href : '1.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '2.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '3.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '4.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '5.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '6.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '7.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '8.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '9.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '10.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '11.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '12.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '13.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '14.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '15.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '16.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '17.jpg',
                        title : 'Bioterapia Sanatatii'
                    },{
                        href : '18.jpg',
                        title : 'Bioterapia Sanatatii'
                    },
                ], {
                    helpers : {
                        thumbs : {
                            width: 75,
                            height: 50
                        }
                    }
                });
            });


        });

UPDATE WITH THE ANSWER

Well, I found out what was wrong, It seems that Fancybox requires the terminal of the image to be CapsLock.

So instead of:

                {
                    href : '1.jpg',
                    title : 'Bioterapia Sanatatii'
                },{
                    href : '2.jpg',
                    title : 'Bioterapia Sanatatii'
                }...and so on

We should write :

                {
                    href : '1.JPG',
                    title : 'Bioterapia Sanatatii'
                },{
                    href : '2.JPG',
                    title : 'Bioterapia Sanatatii'
                }...and so on

Hope this will help others with similar problems.

1
Can you add a jsfiddle - Dave
@dave I will try to put one up now - user3546727
use absolute paths instead of relative ones, so instead of 1.jpg use /path/to/pictures/directory/1.jpg - Mihai Matei
@mateimihai I have done so, but i thought that was a problem so I moved the pictures to my main folder as my index page, that's why they are written only as 1.jpg, but I found the answer, I updated the question with the answer. - user3546727
@dave I found the answer, I updated the question with the answer. - user3546727

1 Answers

0
votes
            {
                href : '1.JPG',
                title : 'Bioterapia Sanatatii'
            },{
                href : '2.JPG',
                title : 'Bioterapia Sanatatii'
            }

For those who come across similar issue.. Try image extension in capital as specified above by alin