2010-02-24 86 views
1

我即将举行婚礼的网站(www.hilaryandmatthew.com)有一个非常漂亮的JQuery幻灯片(www.dynamicdrive.com提供)jQuery的幻灯片不是在IE8的工作,在Safari/Firefox的正常工作

希望我可以尽快获得一些帮助,在发送邀请之前,我真的希望我的网站看起来很锋利。我对jQuery一无所知。因此我遇到了复制&粘贴开源代码的错误。


消息:

当我尝试在IE8加载网页我得到这个错误 'imagearray [...] 0' 为空或不是对象 行:39 字符:3 代码:0 URI:http://www.hilaryandmatthew.com/includes/slideshow/fadeslideshow.js


这是我的图像阵列传递到函数的代码 'fadeSlideShow(settingarg)'

<script type="text/javascript"> 

var mygallery=new fadeSlideShow({ 
    wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow 
    dimensions: [267, 200], //width/height of gallery in pixels. Should reflect dimensions of largest image 
    imagearray: [ 
       ["images/ss1.jpg", "", "", ""], 
       ["images/ss2.jpg", "", "", ""], 
       ["images/ss3.jpg", "", "", ""], 
       ["images/ss4.jpg", "", "", ""], 
       ["images/ss5.jpg", "", "", ""], 
       ["images/ss6.jpg", "", "", ""], 
       ["images/ss7.jpg", "", "", ""], 
       ["images/ss9.jpg", "", "", ""], 
       ["images/ss10.jpg", "", "", ""], 
       ["images/ss11.jpg", "", "", ""], 
       ["images/ss12.jpg", "", "", ""], 
       ["images/ss13.jpg", "", "", ""], 
       ["images/ss14.jpg", "", "", ""], 
       ["images/ss15.jpg", "", "", ""], 

     ], 
    displaymode: {type:'auto', pause:2800, cycles:0, wraparound:false}, 
    persist: false, //remember last viewed slide and recall within same session? 
    fadeduration: 600, //transition duration (milliseconds) 
    descreveal: "ondemand", 
    togglerid: "" 
}) 
</script> 

这是在一个单独的.js文件中有错误的代码:

var fadeSlideShow_descpanel={ 
    controls: [['/includes/slideshow/x.png',7,7], ['/includes/slideshow/restore.png',10,11], ['/includes/slideshow/loading.gif',54,55]], 

//full URL and dimensions of close, restore, and loading images 

fontStyle: 'normal 12px Verdana', //font style for text descriptions 
slidespeed: 200 //speed of description panel animation (in millisec) 
} 

//No need to edit beyond here... 

jQuery.noConflict() 

function fadeSlideShow(settingarg){ 

    this.setting=settingarg 
    settingarg=null 
    var setting=this.setting 
    setting.fadeduration=setting.fadeduration? parseInt(setting.fadeduration) : 500 
    setting.curimage=(setting.persist)? fadeSlideShow.routines.getCookie("gallery-"+setting.wrapperid) : 0 
    setting.curimage=setting.curimage || 0 //account for curimage being null if cookie is empty 
    setting.currentstep=0 //keep track of # of slides slideshow has gone through (applicable in displaymode='auto' only) 
    setting.totalsteps=setting.imagearray.length*(setting.displaymode.cycles>0? setting.displaymode.cycles : Infinity) //Total steps limit (applicable in displaymode='auto' only w/ cycles>0) 
    setting.fglayer=0, setting.bglayer=1 //index of active and background layer (switches after each change of slide) 
    setting.displaymode.randomize=true 
     setting.oninit=setting.oninit || function(){} 
    setting.onslide=setting.onslide || function(){} 
    if (setting.displaymode.randomize) //randomly shuffle order of images? 
     setting.imagearray.sort(function() {return 0.5 - Math.random()}) 
    var preloadimages=[] //preload images 
    setting.longestdesc="" //get longest description of all slides. If no desciptions defined, variable contains "" 
    for (var i=0; i<setting.imagearray.length; i++){ //preload images 
     preloadimages[i]=new Image() 

-LINE 39,SOURCE ERRROR的下面 -

preloadimages[i].src=setting.imagearray[i][0] 

       if (setting.imagearray[i][3] && setting.imagearray[i] 

[3].length>setting.longestdesc.length) 
       setting.longestdesc=setting.imagearray[i][3] 
     } 
     var closebutt=fadeSlideShow_descpanel.controls[0] //add close button to "desc" panel if descreveal="always" 
     setting.closebutton=(setting.descreveal=="always")? '<img class="close" src="'+closebutt[0]+'" style="float:right;cursor:hand;cursor:pointer;width:'+closebutt[1]+'px;height:'+closebutt[2]+'px;margin-left:2px" title="Hide Description" />' : '' 
     var slideshow=this 
     jQuery(document).ready(function($){ //fire on DOM ready 
      var setting=slideshow.setting 
      var fullhtml=fadeSlideShow.routines.getFullHTML(setting.imagearray) //get full HTML of entire slideshow 
      setting.$wrapperdiv=$('#'+setting.wrapperid).css({position:'relative', visibility:'visible', background:'black', overflow:'hidden', width:setting.dimensions[0], height:setting.dimensions[1]}).empty() //main slideshow DIV 
      if (setting.$wrapperdiv.length==0){ //if no wrapper DIV found 
       alert("Error: DIV with ID \""+setting.wrapperid+"\" not found on page.") 
       return 
      } 
      setting.$gallerylayers=$('<div class="gallerylayer"></div><div class="gallerylayer"></div>') //two stacked DIVs to display the actual slide 
       .css({position:'absolute', left:0, top:0, width:'100%', height:'100%', background:'black'}) 
       .appendTo(setting.$wrapperdiv) 
      var $loadingimg=$('<img src="'+fadeSlideShow_descpanel.controls[2][0]+'" style="position:absolute;width:'+fadeSlideShow_descpanel.controls[2][1]+';height:'+fadeSlideShow_descpanel.controls[2][2]+'" />') 
       .css({left:setting.dimensions[0]/2-fadeSlideShow_descpanel.controls[2][1]/2, top:setting.dimensions[1]/2-fadeSlideShow_descpanel.controls[2][2]}) //center loading gif 
       .appendTo(setting.$wrapperdiv) 
      var $curimage=setting.$gallerylayers.html(fullhtml).find('img').hide().eq(setting.curimage) //prefill both layers with entire slideshow content, hide all images, and return current image 
      if (setting.longestdesc!=""){ //if at least one slide contains a description (feature is enabled) 
       fadeSlideShow.routines.adddescpanel($, setting) 
       if (setting.descreveal=="always"){ //position desc panel so it's visible to begin with 
        setting.$descpanel.css({top:setting.dimensions[1]-setting.panelheight}) 
        setting.$descinner.click(function(e){ //asign click behavior to "close" icon 
         if (e.target.className=="close"){ 
          slideshow.showhidedescpanel('hide') 
         } 
        }) 
        setting.$restorebutton.click(function(e){ //asign click behavior to "restore" icon 
         slideshow.showhidedescpanel('show') 
         $(this).css({visibility:'hidden'}) 
        }) 
       } 
       else{ //display desc panel on demand (mouseover) 
        setting.$wrapperdiv.bind('mouseenter', function(){slideshow.showhidedescpanel('show')}) 
        setting.$wrapperdiv.bind('mouseleave', function(){slideshow.showhidedescpanel('hide')}) 
       } 
      } 
      setting.$wrapperdiv.bind('mouseenter', function(){setting.ismouseover=true}) //pause slideshow mouseover 
      setting.$wrapperdiv.bind('mouseleave', function(){setting.ismouseover=false}) 
      if ($curimage.get(0).complete){ //accounf for IE not firing image.onload 
       $loadingimg.hide() 
       slideshow.paginateinit($) 
       slideshow.showslide(setting.curimage) 
      } 
      else{ //initialize slideshow when first image has fully loaded 
       $loadingimg.hide() 
       slideshow.paginateinit($) 
       $curimage.bind('load', function(){slideshow.showslide(setting.curimage)}) 
      } 
      setting.oninit.call(slideshow) //trigger oninit() event 
      $(window).bind('unload', function(){ //clean up and persist 
       if (slideshow.setting.persist) //remember last shown image's index 
        fadeSlideShow.routines.setCookie("gallery-"+setting.wrapperid, setting.curimage) 
       jQuery.each(slideshow.setting, function(k){ 
        if (slideshow.setting[k] instanceof Array){ 
         for (var i=0; i<slideshow.setting[k].length; i++){ 
          if (slideshow.setting[k][i].tagName=="DIV") //catches 2 gallerylayer divs, gallerystatus div 
           slideshow.setting[k][i].innerHTML=null 
          slideshow.setting[k][i]=null 
         } 
        } 
       }) 
       slideshow=slideshow.setting=null 
      }) 
     }) 
    } 

有一些更多的功能在文件..如果他们是相关的,完整的来源可在http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

回答

5

只是为了进一步澄清,我个人花一些找到它...

<script type="text/javascript"> 

var mygallery=new fadeSlideShow({ 
    wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow 
    dimensions: [267, 200], //width/height of gallery in pixels. Should reflect dimensions of largest image 
    imagearray: [ 
       ["images/ss1.jpg", "", "", ""], 
       ["images/ss2.jpg", "", "", ""], 
       ["images/ss3.jpg", "", "", ""], 
       ["images/ss4.jpg", "", "", ""], 
       ["images/ss5.jpg", "", "", ""], 
       ["images/ss6.jpg", "", "", ""], 
       ["images/ss7.jpg", "", "", ""], 
       ["images/ss9.jpg", "", "", ""], 
       ["images/ss10.jpg", "", "", ""], 
       ["images/ss11.jpg", "", "", ""], 
       ["images/ss12.jpg", "", "", ""], 
       ["images/ss13.jpg", "", "", ""], 
       ["images/ss14.jpg", "", "", ""], 
       ["images/ss15.jpg", "", "", ""], <<==== Delete this comma 

     ], 
4

该问题是直接在您发布的第一个代码块:Internet E xplorer不喜欢在对象和数组中使用尾随逗号。
你只需要在最后一个元素删除尾随逗号imagearray,它应该工作(如果没有,检查其他数组和对象为同一问题)