0

我有一个主页。我想做很多网站目前正在做的事情,他们动态显示一些大图像。具体来说,我有 5 个 900 像素 x 400 像素的图像要显示 - 我可以使用 Javascript setInterval 等来完成 - 但我也想知道如何添加一些淡入淡出效果 - 我正在用 c# 编码,但是我能想到的唯一优雅的方法是使用 javascript - 如果有人可以给我一个教程链接或粘贴他们喜欢的代码片段,我将不胜感激。谢谢!

4

3 回答 3

2

用 C# 编码不会让你产生淡化效果,你需要 Javascript。当然,您可以使用 C# 加载图像的第一个实例,但任何带有效果或计时器的内容都需要使用 Javascript 或 jQuery。大多数网站实际上会使用 jQuery 插件来实现这个主要的淡入/淡出幻灯片功能。那里有很多对您有好处的滑块插件。

如果你觉得你想建立自己的,这里有一些可以让你前进的东西。

<img src="img0.jpg">
<img src="img1.jpg">
<img src="img2.jpg">
<img src="img3.jpg">

$(function() {

    var i = 0;

    // Four-second interval
    setInterval(function() {
        $("#img").fadeOut(function() {
            $(this).attr("src", "img" + i++ % 4 + ".jpg");
            $(this).fadeIn();
        });
    }, 4000);
}

每 4 秒它会遍历图像 1 到 4,淡入淡出。

或者,您可以只下载一个预构建的 jQuery 滑块插件,如下所示:

于 2012-07-28T15:51:21.273 回答
1

你需要的是一个 jQuery 图像轮播。

在这里放一些最好的链接。

1) http://wowslider.com/demo.html:很棒的一块,可以很好地集成。
2) http://www.jcoverflip.com/
3) http://galleria.io/ : 现象级

您还可以查看jQuery 效果,以便您可以更好地实现自己的效果。

于 2012-07-28T15:46:05.530 回答
0

BXSlider 是一个很棒的轻量级简单易用的 jquery 滑块。

请参阅http://bxslider.com

特征

  • 水平、垂直和淡入淡出过渡
  • 一次显示和移动多张幻灯片(轮播)
  • 上一个/下一个,寻呼机,自动控制
  • 轻松过渡
  • 随机开始
  • 代码模式
  • before, after, first, last, next, prev 回调函数
  • 包括可选样式
  • 大量的选择
于 2012-07-28T16:13:22.380 回答