Note that there are some explanatory texts on larger screens.

plurals
  1. POJavaScript ImageSlider don't work
    primarykey
    data
    text
    <p>Hello :) Why do this JavaScript not work in the FF 3.6 but in the IE7/8 this Script works good?</p> <p>You can see the Problem on this Site: <a href="http://www.conventioncologne.de/en/social-program/city-tours/adventure-tours/tutanchamun-late-walk-allein-mit-dem-pharao.html" rel="nofollow">http://www.conventioncologne.de/en/social-program/city-tours/adventure-tours/tutanchamun-late-walk-allein-mit-dem-pharao.html</a></p> <p><strong>imgslider.js</strong></p> <pre><code>Array.prototype.search = function(value, strict ) { if( typeof value == "undefined" ) { return false; } var retVal = false; if( strict ) { for( key in this ) { if( this[key] === value ) { retVal = key; break; } } } else { for( key in this ) { if( this[key] == value ) { retVal = key; break; } } } return retVal; } var smallimg = new Array(); var bigimg = new Array(); window.addEvent('load', function(){ var list = $$('div.smalldiv'); list.each(function(element) { var imageset = parseInt(element.getAttribute('imageset')); var layertop = $('layertop'+imageset); var layerbottom = $('layerbottom'+imageset); var fx = new Fx.Styles(layertop, {duration:500, transition: Fx.Transitions.linear}); element.addEvent('mouseenter', function(){ var newfilename = element.getStyle('background-image'); newfilename = newfilename.replace(/^url\(/,""); newfilename = newfilename.replace(/\)$/,""); var posnewfilename = smallimg[imageset].search(newfilename); var newbackground = 'url('+bigimg[imageset][posnewfilename]+')'; var oldbackground = layerbottom.getStyle('background-image'); old = oldbackground.replace(/^url\(/,""); old = old.replace(/\)$/,""); var posoldfilename = bigimg[imageset].search(old); var smallbackground = 'url('+smallimg[imageset][posoldfilename]+')'; element.setStyle('background-image',smallbackground); layertop.setStyle('opacity','1'); layertop.setStyle('background-image',oldbackground); layerbottom.setStyle('background-image',newbackground); fx.start({ 'opacity': '0.0' }); }); element.addEvent('mouseleave', function(){ }); }); }); </code></pre> <p><strong>And this is the HTML Script:</strong></p> <pre><code>&lt;script type="text/javascript"&gt; bigimg['23853'] = new Array(); smallimg['23853'] = new Array(); bigimg['23853'][2]="typo3temp/pics/fee2d2a895.jpg";bigimg['23853'][1]="typo3temp/pics/e6921d3e9b.jpg";bigimg['23853'][0]="typo3temp/pics/88b5582780.jpg"; smallimg['23853'][2]="typo3temp/pics/c39223197f.jpg";smallimg['23853'][1]="typo3temp/pics/1bec8c0545.jpg";smallimg['23853'][0]="typo3temp/pics/6b8d3cdc74.jpg"; &lt;/script&gt; </code></pre> <p><strong>And the DIV's for the Slider:</strong></p> <pre><code>&lt;div&gt; &lt;div style="position: relative; display: block; float: left;"&gt; &lt;div style="display: block; float: left; width: 235px; height: 133px;"&gt; &lt;div id="layerbottom23853" style="position: absolute; top:0px; left: 0px; width: 235px; height: 133px; background: url(typo3temp/pics/88b5582780.jpg)"&gt;&lt;/div&gt; &lt;div id="layertop23853" style="position: absolute; top:0px; left: 0px; width: 235px; height: 133px;"&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="small" style="display: block; float: left; clear: left; margin: 10px 0 0 0;"&gt; &lt;div id="small_img1" class="smalldiv" imageset="23853" style="margin: 0 10px 0 0; display: block; float: left; width: 112px; height: 64px; background: url(typo3temp/pics/1bec8c0545.jpg)"&gt;&lt;/div&gt; &lt;div id="small_img2" class="smalldiv" imageset="23853" style="margin: 0 10px 0 0; display: block; float: left; width: 112px; height: 64px; background: url(typo3temp/pics/c39223197f.jpg)"&gt;&lt;/div&gt; &lt;/div&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload