Images not loading with BASE tag

GoogleCodeExporter commented 9 years ago

Note: If this is a troubleshooting question, please first look in the FAQ
(http://code.google.com/p/slideshow/wiki/FAQ), search in the Google Group
(http://groups.google.com/group/mootools-slideshow) and / or post your
question there! This form is only for technical issues / bugs, thank you.

What steps will reproduce the problem?
1. add a BASE tag between the <head></head>
2. host your js, css, images files on the website of the BASE tag
3. host your html file (see code below) on another website

CODE: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <base href="http://www.child-soldiers.be/" />
    <title>Slideshow 2!</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="author" content="Aeron Glemann
(http://www.electricprism.com/aeron/)" />
    <link rel="stylesheet" type="text/css" href="css/slideshow.css"
media="screen" />
    <link rel="stylesheet" type="text/css" href="css/lightbox.css"
media="screen" />
    <script type="text/javascript" src="js/mootools.js"></script>
    <script type="text/javascript" src="js/slideshow.js"></script>
    <script type="text/javascript" src="js/slimbox.js"></script>
    <script type="text/javascript">     
    //<![CDATA[
      window.addEvent('domready', function(){
        var data = {};
        $$('.slideshow_content').each(function(P){
this['http://www.child-soldiers.be/images/' + P.get("src")] = { 'caption':
P.get("alt"), 'thumbnail' : 'http://www.child-soldiers.be/images/thumb_' +
P.get("src") }; }, data);                 
        var myShow = new Slideshow('show', data, { captions: true, controller:
true, delay: 3000, height: 400, thumbnails: true, linked: true, width: 600 });
        var box = new Lightbox({ 
              'onClose': function(){ this.pause(false); }.bind(myShow), 
              'onOpen': function(){ this.pause(true); }.bind(myShow) 
        });
        });
    //]]>
    </script>
</head>
<body>
    <div id="show" class="slideshow">
        <div class="slideshow-images">

<a rel="lightbox" href="1228404780a80cS3.jpg" title="15 oktober 2008 - Rode
Handen inzameling bij vertoning Ezra"><img class="slideshow_content"
src="1228404780a80cS3.jpg" width="800" height="534" alt="15 oktober 2008 -
Rode Handen inzameling bij vertoning Ezra" /></a><span
class="mbf-item">#gallery img_1228404780a80cS3</span>

<a rel="lightbox" href="1228404704G55OR40.jpg" title="15 oktober 2008 -
Rode Handen inzameling bij vertoning Ezra"><img class="slideshow_content"
src="1228404704G55OR40.jpg" width="800" height="534" alt="15 oktober 2008 -
Rode Handen inzameling bij vertoning Ezra" /></a><span
class="mbf-item">#gallery img_1228404704G55OR40</span>

<a rel="lightbox" href="1228404630S89Tw93.jpg" title="15 oktober 2008 -
Rode Handen inzameling bij vertoning Ezra"><img class="slideshow_content"
src="1228404630S89Tw93.jpg" width="800" height="534" alt="15 oktober 2008 -
Rode Handen inzameling bij vertoning Ezra" /></a><span
class="mbf-item">#gallery img_1228404630S89Tw93</span>

        </div>

    </div>

</body>
</html>

What is the expected output? What do you see instead?

What version of the product are you using? On what operating system and
browser?

Please provide any additional information below.

Original issue reported on code.google.com by dieusurt...@gmail.com on 20 Feb 2009 at 6:01

GoogleCodeExporter commented 9 years ago

to see them in action

http://www.child-soldiers.be/test.html (working)
http://www.enfant-soldat.be/test.html (not working)

Original comment by dieusurt...@gmail.com on 20 Feb 2009 at 6:26

GoogleCodeExporter commented 9 years ago

I'm pretty sure this is the same issue discussed in the FAQ:

http://code.google.com/p/slideshow/wiki/FAQ?ts=1236644720&updated=FAQ#Why_aren%2
7t_the_Slideshow_animations_working_correctly?

It has to do with browser security and Javascript trying to read in CSS from a
stylesheet on a different domain than the HTML.

Original comment by aeron.gl...@gmail.com on 10 Mar 2009 at 12:26

Changed state: Invalid

zoelaw / slideshow

Images not loading with BASE tag #72