可互动的360度超炫3D旋转立方体动画特效

所属分类:媒体-图片展示

 9754  57  查看评论 (9)
可互动的360度超炫3D旋转立方体动画特效 ie兼容10

这是一款可互动的360度超炫3D旋转立方体动画特效。用户可以使用鼠标拖动立方体来查看各个面,或者通过点击左侧的导航链接页可以切换到立方体相应的面中。

使用方法

HTML结构

<div class="container">
  <div class="inner">
    <div class="sub front"></div>
    <div class="sub left"></div>
    <div class="sub right"></div>
    <div class="sub back"></div>
    <div class="sub top"></div>
    <div class="sub bottom"></div>
    <div class="smallCube">
      <div class="side front">
        <div style="background-image:url(img/first-citadel-hero-bg.jpg);"></div>
      </div>
      <div class="side left">
        <div style="background-image:url(img/2560x14404ae8.jpg);"></div>
      </div>
      <div class="side right">
        <div style="background-image:url(img/SKINsPromotionalImage.jpg);"></div>
      </div>
      <div class="side back">
        <div style="background-image:url(img/ShipSkin_MatiguSeabeast_Caldari.jpg);"></div>
      </div>
      <div class="side top">
        <div style="background-image:url(img/Structure_Assault_Mechanics.jpg);"></div>
      </div>
      <div class="side bottom">
        <div style="background-image:url(img/emerging.jpg);"></div>
      </div>
    </div>
  </div>
</div>

该3D立方体特效使用的是一个<div>元素作为包裹容器,然后里面使用6个子<div>作为立方体的6各面,另外在立方体中还有一个小的立方体,它的6个面分别贴上不同的图片。


相关插件-图片展示

画廊插件baguetteBox.js

baguetteBox.js 是一个简单和易于使用lightbox纯JavaScript脚本。
  图片展示
 12910  50

漂亮绚丽的色票插件-SWATCH BOOK

SWATCH BOOK 是一款用css3和jquery打造的动画色票插件。其中用到了css的旋转变换,每个色票都是可以点击的,当我们点击某个色票时,为了完全显示该色票,其他的色票将会被旋转开。注意:该插件只能运行在支持css3的浏览器中。
  图片展示
 7872  40

推荐好看的图片相册插件-MICRO IMAGE GALLERY PLUGIN

这里我要介绍的是最新的 Micro Image Gallery Plugin。作者在考虑过建议后给该版本增添了一些特征。尤其是自动播放方法,可以为每张图片加上描述,以及循环模式。注意,这里的自动播放只能在循环模式设置后才能设置。只需要把文本放在img标签的 alt 属性里面即可设置每张图片的文本显示。
  图片展示
 8144  4

具有自动分组自适应的jQuery缩略图

这个实验的jQuery插件允许使用一堆效果缩略图的自动分组。缩略图将组根据自己的共享数据堆属性,一旦点击,组将分散及其缩略图飞到他们的位置。
  图片展示
 10055  38

讨论这个项目(9)回答他人问题或分享插件使用方法奖励jQ币

    胡三猫 0
    2016/7/4 17:07:12
    kare的春天 0
    2016/5/5 20:05:38
    手机端怎么不好使? 回复
    行尸走肉 0
    2016/5/5 18:05:11
    ?岚 0
    2016/5/4 9:05:52
    有始有终 0
    2016/5/3 16:05:00
    魂牵梦绕锁你心扉〃 0
    2016/4/22 8:04:48
    scifier 0
    2016/3/31 11:03:03
    哈!我大EVE无处不在! 回复
    宇┞ 0
    2016/3/18 15:03:47
    这个3D确实酷炫,比很多贴图的看起来好多了 回复
    FreeFall 0
    2016/3/17 10:03:42
    旋转特效很真实。 回复
取消回复
    PROMULGATOR

    家乐

    火星