【问题标题】:Changing pictures every 5 seconds using jquery in php [closed]在php中使用jquery每5秒更改一次图片[关闭]
【发布时间】:2013-12-17 16:32:43
【问题描述】:

请帮助我,我是 jQuery 新手。 这是我的代码:

<img src="default.jpg" />
<img src="a.jpg" />
<img src="b.jpg" />
<img src="c.jpg" />

我想将图片从 default.jpg 更改为 a.jpg。然后 a.jpg 到 b.jpg 等等,每 5 秒一次。使用jQuery。非常感谢

【问题讨论】:

  • 您的具体编程相关问题是什么?
  • 请阅读常见问题解答。表现出一些努力,人们会帮助你。

标签: javascript php jquery html


【解决方案1】:
<img id="thisImg" alt="img" src="images/img0.png"/>
<script type="text/javascript">
    $(function(){
        //prepare Your data array with img urls
        var dataArray=new Array();
        dataArray[0]="images/img1.png";
        dataArray[1]="images/img2.png";
        dataArray[2]="images/img3.png";
        dataArray[3]="images/img0.png";

        //start with id=0 after 5 seconds
        var thisId=0;

        window.setInterval(function(){
            $('#thisImg').attr('src',dataArray[thisId]);
            thisId++; //increment data array id
            if (thisId==3) thisId=0; //repeat from start
        },5000);        
    });
</script>

【讨论】:

  • 谢谢@archios 这对我有很大帮助。我只想以缓慢淡入的方式显示图像。有可能吗?
  • 只需修改内部 setInterval 函数以使用 jq 动画更改图像(如 fadeIn linklink。您也可以使用 link jq 动画函数。对于fadeOut fadeIn 更改的代码将看起来像: $('#thisImg').fadeOut(function () { $('#thisImg').attr('src', dataArray[thisId]); thisId++; if (thisId == 3) thisId = 0; $('#thisImg').fadeIn(); }); 记得预加载图片(google: preload images jquery)
  • 感谢您的帮助:)
【解决方案2】:

在 head 中设置

<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>

jquery 代码

setInterval(function(){
$('#img').remove();
$('body').prepend('<img src="urlimgs" id="img">');
},5000);

我不明白你想要什么,但它是如此基本!您需要了解有关 jquery 的更多信息。 您可以改进此代码.. 这只是一个示例

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2020-08-14
    • 2020-04-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-11-11
    • 2013-02-06
    • 1970-01-01
    相关资源
    最近更新 更多