V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
yangyouzhi
V2EX  ›  问与答

wordpress怎么实现图片轮播?

  •  
  •   yangyouzhi · 2013-12-07 11:06:35 +08:00 · 12703 次点击
    这是一个创建于 3989 天前的主题,其中的信息可能已经有所发展或是发生改变。
    看到一个站长的博客(链接:http://www.wanghaida.com/)特喜欢他网站上面那张动态的大图想弄到自己博客上。但是不知道怎么实现。也搜索了,搞了很长时间了,实在解决不了。我是新手。通过谷歌的审查元素,看他是用三张静态图实现的幻灯效果。我通过引用他上面的代码,在我的博客上是一张静态图。后来又弄了一个Nivo Slider插件,还是没有实现。实在没办法了,希望大家帮忙解答下,感激不尽.我用的是国外的免费空间,用来学习。(地址:http://mianfei8.comoj.com/)
    16 条回复    2015-03-06 23:08:00 +08:00
    qiayue
        1
    qiayue  
       2013-12-07 11:45:42 +08:00
    他用的是大前端开源的主题 http://www.daqianduan.com/

    如果你只是想要图片轮播的话,去搜索 幻灯片 插件
    yangyouzhi
        2
    yangyouzhi  
    OP
       2013-12-07 11:56:43 +08:00
    @qiayue 我想实现他的那种效果,我用的也是那主题。
    ccbikai
        3
    ccbikai  
       2013-12-07 12:21:22 +08:00 via Android
    只想说他把主题改的好差

    手机上边
    chairuosen
        4
    chairuosen  
       2013-12-07 12:24:00 +08:00
    以此兴趣为动力,学习Js去吧,你会爱上前端的
    Zhang
        5
    Zhang  
       2013-12-07 12:25:20 +08:00
    学js吧
    yangyouzhi
        6
    yangyouzhi  
    OP
       2013-12-07 12:53:53 +08:00
    @Zhang
    @chairuosen
    @ccbikai
    @qiayue 你们先教我怎么解决可以吗?各种搜索,实在解决不了。不管是用代码,还是用插件都没有调用起来。我用的他这代码显示的只是静态图...
    <section class="container">
    <div class="banner banner-site"><style type="text/css">#banner{width:100%;height:250px;overflow:hidden;}.index_4{width:100%;height:250px;background:rgb(186,63,55) url(http://blog.wanghaida.com/static/img/banner-2013.jpg) no-repeat center center;}.index_3{width:100%;height:250px;background:#354f0e url(http://blog.wanghaida.com/static/img/3.jpg) no-repeat center center;}.index_2{width:100%;height:250px;background:#8f6f18 url(http://blog.wanghaida.com/static/img/2.jpg) no-repeat center center;}.index_1{width:100%;height:250px;background:#5b1a3c url(http://blog.wanghaida.com/static/img/1.jpg) no-repeat center center;}</style>
    <div id="banner" class="slideshow" style="position: relative;">
    <div class="index_1" style="position: absolute; top: 0px; left: 0px; display: block; z-index: 4; opacity: 1; width: 1320px; height: 250px;"></div>
    <div class="index_2" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 3; opacity: 0; width: 1320px; height: 250px;"></div>
    <div class="index_3" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 3; opacity: 0; width: 1320px; height: 250px;"></div>
    </div></div>
    </section>
    tayuo
        7
    tayuo  
       2013-12-07 12:59:19 +08:00
    http://html5maker.com 做好了iframe上去...


    不是办法的办法
    lemonda
        8
    lemonda  
       2013-12-07 13:25:12 +08:00
    http://jquery.malsup.com/cycle/
    fade 效果,只能帮到这了
    顺嘴问下D8主题付费了么?
    http://www.daqianduan.com/theme/d8
    emric
        9
    emric  
       2013-12-07 13:27:27 +08:00
    yangyouzhi
        10
    yangyouzhi  
    OP
       2013-12-07 14:45:54 +08:00
    @tayuo 还是不会。。。
    yangyouzhi
        11
    yangyouzhi  
    OP
       2013-12-07 14:54:49 +08:00
    @tayuo 在线制作好,怎么用?
    yangyouzhi
        12
    yangyouzhi  
    OP
       2013-12-07 15:06:19 +08:00
    <!-- Start Animation Code from html5maker.com -->
    [iframe height="200" width="1024" src="http://cdn.html5maker.com/8810bbd2be297a53de15d45e072c98b7eb80832eef.html" frameborder="0" scrolling="no"]
    <!-- End Animation Code -->

    这应该放在哪个文件里?
    tayuo
        13
    tayuo  
       2013-12-07 15:26:57 +08:00   ❤️ 1
    你主题文件index.php或header.php相应的位置。

    <iframe height="200" width="1024" src="http://cdn.html5maker.com/8810bbd2be297a53de15d45e072c98b7eb80832eef.html" frameborder="0" scrolling="no"></iframe>
    yangyouzhi
        14
    yangyouzhi  
    OP
       2013-12-07 16:30:09 +08:00
    @tayuo 太谢谢你了,总算可以了
    yangyouzhi
        15
    yangyouzhi  
    OP
       2013-12-07 17:49:12 +08:00
    没有他那博客效果好。。。。
    igfw
        16
    igfw  
       2015-03-06 23:08:00 +08:00
    有空再来看看,看着不好整
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   927 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 20:35 · PVG 04:35 · LAX 12:35 · JFK 15:35
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.