1

这是我第一次尝试使用 Mootools,所以我欢迎对代码提出批评。

我有一个动态图像列表,这些图像在“点击”事件上展开并在“mouseout”事件上收缩。代码在所有浏览器(FF、Safari、Chrome,甚至智能手机)中都可以正常工作,但在 IE9 中却不行(JS 已启用)

有类似问题或解决方案的人吗?

我打算使用灯箱效果,将更大更清晰的图像下载到页面中心,而不是仅仅调整小图像的大小。但是,如果 IE9 有问题,我会犹豫是否尝试这样做。

我已经使用上传提交编码了三种图像大小,因此灯箱可以使用较大的图像,但是,我在 mootools 中没有看到灯箱的任何内容,或者我错过了它?

$i = 0;
while($i < count($validate)) {
    <div class="validate">
        <div class="validate_image_<?php echo $validate[$i]['validate_type']; ?>">
            <div class="validate_image" id="validate_image_wrapper_<?php echo $i; ?>">
                <?php 
                if ($validate[$i]['validate_image_filename'] != '') {
                    if (file_exists(UPLOAD_DIR . 'validate_image/' . str_replace('.', '_medium.', $validate[$i]['validate_image_filename']))) {
                        echo '<img src="' . UPLOAD_URL . 'validate_image/' . str_replace('.', '_medium.', $validate[$i]['validate_image_filename']) . '" alt="Listing Image" />';
                } else {

                        echo '<img src="' . UPLOAD_URL . 'validate_image/' . str_replace('.', '_large.', $validate[$i]['validate_image_filename']) .  '" alt="Listing image"  />';
                }

            } else {
               ?>   
               <img src="/images/no_image_posted_validate.png" alt="no image posted"  />
               <?php
            }
            ?>
        </div>

  ... remainder of HTML display code 


function setupEnlargeImage() {
    window.myFx = new Fx({
            duration: 200,
            transition: Fx.Transitions.Sine.easeOut
    });

    $$('.validate_image').addEvent('click', function() {
         window.selectedImage = this.id;
         myFx.start(1,2.0);
    });

    $$('.validate_image').addEvent('mouseout', function() {
        window.selectedImage = this.id;
        myFx.start(1.0,1);
    });

    myFx.set = function(value) {
        var style = "scale(" + (value) + ")";
        $(window.selectedImage).setStyles({
            "-webkit-transform": style,
            "-moz-transform": style,
            "-o-transform": style,
            "-ms-transform": style,
            transform: style
        });
    }
}
4

1 回答 1

0

好吧,IE9 没有解决方案,但是我去 Slimbox 获取图像,它在 IE9 中运行良好。

所以,这个问题是封闭的。

于 2012-11-12T22:57:35.367 回答