-1

我正在尝试全屏显示与单击的图像不同的图像。我想全屏显示 gif，而不是 png。这是使用的代码

$('img#pic01').click(function() {
    var png = $(this).attr("src");
    var gif = png.split("png");
    var element = gif[0]+"gif";
    $('img#pic01').attr("src", "element");
    if (screenfull.enabled) {
        // We can use `this` since we want the clicked element
        screenfull.toggle(this);
    }
});

<a href="#" class="thumbnail">
    <img src="<?php echo base_url().'assets/img/animation01.png' ?>"
        alt="Abertura normal das vias Respiratórias" id="pic01">
</a>

提前致谢

更新

这就像一个魅力......我的坏处是错过了var点..现在我需要在退出时将属性放回png，否则退出全屏后会出现gif，而不是png。

像这样的东西

$('img#pic01').click(function() {
    var png = $(this).attr("src");
    var gif = png.split("png");
    var element = gif[0]+"gif";
    $('img#pic01').attr("src", element);
    if (screenfull.enabled) {
        // We can use `this` since we want the clicked element
        screenfull.toggle(this);
    }
    if (screenfull.exit) {
        var gif_ = $(this).attr("src");
        var png_ = gif_.split("gif");
        var element_ = png_[0]+"png";
        $('img#pic01').attr("src", element_);
    }
});
4

1 回答 1

2

为了使您的示例有效，您可能应该更改

$('img#pic01').attr("src", "element");

至

$('img#pic01').attr("src", element);

引号当前意味着您将图像源更改为文本“元素”而不是变量的值。

更新

在回答你的新问题时，你应该使用 screenfull.onchange 因为 screenfull.exit 是一个退出全屏的函数。我在下面添加了一个示例。我还整理了不必要的“img#pic01”的重复使用。

$('img#pic01').click(function() {
    var png = $(this).attr("src");
    var gif = png.split("png");
    var element = gif[0]+"gif";
    var _obj = $(this);
    _obj.attr("src", element);

    if (screenfull.enabled) {
        // We can use `this` since we want the clicked element
        screenfull.toggle(this);
    }

    // Set the callback function that is called when screenfull changes state
    screenfull.onchange = function() {
        // Back to the normal page state
        if(!screenfull.isFullscreen) {
            _obj.attr("src", png);
        }
    };
});
于 2012-11-22T14:09:57.300 回答