Prototype / jQuery与lightview和rotator没有冲突IE8问题

时间:2011-04-24 22:24:26

标签: internet-explorer-8 prototypejs jquery

我设法使用了noconflict解决方案。一切都很好,除了在IE8中...我发现90%的改变它是PHP本身的javascript。我改变了$(到jQuery(。这个改变使一切都在所有其他浏览器中工作......任何人都有这个解决方案吗?也尝试改变脚本的位置,但没有做任何事情。使用Lightview和Rotator。

url => http://www.tdesigns.be/projects/maes-boons/designmeubelen.php

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="robots" content="all" />
<meta name="revisit-after" content="1 week" />
<meta name="language" content="nl"  />
<meta name="keywords" content=""/>
<meta name="description" content="maes-boons nv - meesters in maatwerk"/>
<title>maes-boons</title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link rel="stylesheet" type="text/css" href="css/960.css" />
<link rel="stylesheet" type="text/css" href="css/reset.css" />
<link rel="stylesheet" type="text/css" href="css/wt-rotator.css"/>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.min.js"></script>
<script type="text/javascript" src="js/jquery.wt-rotator.min.js"></script>
<script type="text/javascript">
        jQuery(document).ready( 
            function() {
                jQuery(".container").wtRotator({
                    width:960,
                    height:400,
                    button_width:24,
                    button_height:24,
                    button_margin:5,
                    auto_start:true,
                    delay:5000,
                    play_once:false,
                    transition:"fade",
                    transition_speed:800,
                    auto_center:true,
                    easing:"",
                    cpanel_position:"inside",
                    cpanel_align:"BR",
                    timer_align:"top",
                    display_thumbs:true,
                    display_dbuttons:true,
                    display_playbutton:true,
                    display_numbers:true,
                    display_timer:true,
                    mouseover_pause:false,
                    cpanel_mouseover:false,
                    text_mouseover:false,
                    text_effect:"fade",
                    text_sync:true,
                    tooltip_type:"image",
                    lock_tooltip:true,
                    shuffle:false,
                    block_size:75,
                    vert_size:55,
                    horz_size:50,
                    block_delay:25,
                    vstripe_delay:75,
                    hstripe_delay:180           
                });
            }
        );
</script>
<script> 
jQuery.noConflict();

jQuery(document).ready(function() {
});
</script>
<script type="text/javascript" src="js/prototype.js"></script>
<link rel="stylesheet" type="text/css" href="css/lightview.css" />
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.2/scriptaculous.js'></script>
<script type="text/javascript" src="js/lightview.js"></script>


</head>

1 个答案:

答案 0 :(得分:0)

如果您使用.noConflict(),我认为您需要将所有jQuery放在.ready()函数中。我在IE8或Chrome12中没有出现以下错误:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset=utf-8 />
    <title>maes-boons</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="http://www.tdesigns.be/projects/maes-boons/js/jquery.easing.1.3.min.js"></script>
    <script type="text/javascript" src="http://www.tdesigns.be/projects/maes-boons/js/jquery.wt-rotator.min.js"></script>
    <script type="text/javascript"> 
        jQuery.noConflict();
        jQuery(document).ready(function($) {
            $(".container").wtRotator({
                width:960,
                height:400,
                button_width:24,
                button_height:24,
                button_margin:5,
                auto_start:true,
                delay:5000,
                play_once:false,
                transition:"fade",
                transition_speed:800,
                auto_center:true,
                easing:"",
                cpanel_position:"inside",
                cpanel_align:"BR",
                timer_align:"top",
                display_thumbs:true,
                display_dbuttons:true,
                display_playbutton:true,
                display_numbers:true,
                display_timer:true,
                mouseover_pause:false,
                cpanel_mouseover:false,
                text_mouseover:false,
                text_effect:"fade",
                text_sync:true,
                tooltip_type:"image",
                lock_tooltip:true,
                shuffle:false,
                block_size:75,
                vert_size:55,
                horz_size:50,
                block_delay:25,
                vstripe_delay:75,
                hstripe_delay:180
            });
        });
</script>
<script type="text/javascript" src="http://www.tdesigns.be/projects/maes-boons/js/prototype.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.2/scriptaculous.js"></script>
<script type="text/javascript" src="http://www.tdesigns.be/projects/maes-boons/js/lightview.js"></script>
</head>
<body>
</body>
</html>