4

这是我的网站

如果您单击小缩略图,则会显示更大的图像。在 Chrome 中它可以完美运行,但是当我在 IE9 中尝试它时,它什么也没做。这是我的代码:

jQuery

// JavaScript Document

//Button1
;(function($) {

         // DOM Ready
        $(function() {

            // Binding a click event
            // From jQuery v.1.7.0 use .on() instead of .bind()
            $('#my-button').bind('click', function(e) {

                // Prevents the default action to be triggered. 
                e.preventDefault();

                // Triggering bPopup when click event is fired
               $('#element_to_pop_up').bPopup({
                    appendTo: 'form'
                    , zIndex: 2
                    , modalClose: false
                });
            });
         });
     })(jQuery);
//Button2



     ;(function($) {

         // DOM Ready
        $(function() {

            // Binding a click event
            // From jQuery v.1.7.0 use .on() instead of .bind()
            $('#my-button1').bind('click', function(e) {

                // Prevents the default action to be triggered. 
                e.preventDefault();

                // Triggering bPopup when click event is fired
               $('#element_to_pop_up1').bPopup({
                    appendTo: 'form'
                    , zIndex: 2
                    , modalClose: true
                });
            });
         });
     })(jQuery);


     ;(function($) {
//Button3


         // DOM Ready
        $(function() {

            // Binding a click event
            // From jQuery v.1.7.0 use .on() instead of .bind()
            $('#my-button2').bind('click', function(e) {

                // Prevents the default action to be triggered. 
                e.preventDefault();

                // Triggering bPopup when click event is fired
               $('#element_to_pop_up2').bPopup({
                    appendTo: 'form'
                    , zIndex: 2
                    , modalClose: false
                });
            });
         });
     })(jQuery);

还有我的 HTML

<!-- Portfolio Popup Box -->

    <div id="element_to_pop_up">
             <a class="bClose">x<a/>
             <img src="imgs/portfolio/bobbie.png" width="100%" height="100%" alt="Bobbie Gordon Website" /> 
    </div>

    <div id="element_to_pop_up1">
             <a class="bClose">x<a/>
             <img src="imgs/portfolio/jareth.png" width="100%" height="100%" alt="Bobbie Gordon Website" /> 
    </div>

    <div id="element_to_pop_up2">
             <a class="bClose">x<a/>
    </div>

<!-- Portfolio Popup Box End -->

CSS

#element_to_pop_up { 
    padding:5px;
    color:#000;
    display:none; 
    width:90%;
    height: 100%;
    position:absolute;
    border:1px solid #000;
}
#element_to_pop_up1 { 
    padding:5px;
    color:#000;
    display:none; 
    width:90%;
    height: 90%;
    position:absolute;
}
#element_to_pop_up2 { 
    padding:5px;
    color:#000;
    display:none; 
    width:90%;
    height: 90%;
    position:absolute;
}

.bClose{
    cursor:pointer;
    position:absolute;
    right:-15px;
    top:-15px;
    font-size:22px;
    font-weight:bold;
}

我很确定这与绑定 onclick 有关。也许 IE 不识别它?或者只是在您单击它时取消它,从而产生什么都没有发生的效果。

谢谢大家。

由于 Sparky,现在已解决此问题!

4

1 回答 1

6

将您的 jQuery 版本转换.bind()为或降级。.on()您的站点正在运行jQuery 1.9,它几乎删除了所有已弃用的功能。您还可以包含迁移插件

此外,对于网站在 Explorer 中正常工作的任何希望,您必须首先验证 HTML:

http://validator.w3.org/check?uri=http%3A%2F%2Fjohns-webdesign.com%2Fport.html&charset=%28detect+automatically%29&doctype=Inline&group=0

于 2013-02-13T18:11:07.577 回答