javascript HTML5自定义元素播放焦点图动画

这是一款基于HTML5的焦点图动画，它和其他焦点图不同的地方在于，它播放的不仅仅是图片，而是可以自定义控制的网页元素。它不仅在图片间切换有过渡动画效果，而且在切换时图片中的元素也将出现动画效果，比如图中的文字移动、打散、重新组合等，这款HTML5动画图片播放器算得上是高端大气上档次。

效果图：

超文本标记语言代码

div class=' parallax-BG ' id=' slider-wrap ' div class=' slider parallax-BG ' id=' slider ' div class=' slider-sections sandbox ' section class=' first ' img alt=' Kendo UI ' src=' http : images/home-banner-1。png '/div class=' text ' h2SmartSite Ver 2.2 br/智能网站管理系统/h2 p class='copy '采用前后台完全分离技术，通过标签（支持标签循环嵌套、判断标签、自定义标签、文件循环嵌套等)加模板技术。全站生成纯静态页/p p class=' button ' a href=' # ' onclick=' _ gaq。push([' _ trackPageview '，' # '])；下载/a class=' dimed ' onclick=' _ gaq。push([' _ trackPageview '，' # '])；href='# '了解更多/a/p/div/section section img src=' http : images/dataviz-home-image-Q2。png ' alt=' Kendo UI '/div class=' text ' style=' padding-top 3360 10px；氘企业网站管理系统/h2 p class='copy '单页面、单页面索引、新闻、产品展示、下载、友情链接、网上商城，在线支付、配送、支付方式管理、广告等模块/p p class=' button ' a href=' # ' onclick=' _ gaq。push([' _ TrackPageView '，' # '])；''下载/a class=' dimed ' onclick=' _ gaq。push([' _ trackPageview '，' # '])；'href='# '了解更多/a/p/div/section section img src=' http : images/home _ banner _ web-Q2。png ' alt=' Kendo UI '/div class=' text ' H2智能移动网站管理系统/h2 p class='copy '基于jquery .手机、HTML5技术框架，前后台完全分离，采用标签加模板技术，全站生成纯静态页/p p class=' button ' a href=' # ' onclick=' _ gaq。push([' _ trackPageview '，' # '])；下载/a class=' dimed ' onclick=' _ gaq。push([' _ trackPageview '，' # '])；href='# '了解更多/a/p/div/section/div/div a class=' slider-prev ' href=' JavaScript : void(0)'？/a a class=' slider-next ' href=' JavaScript : void(0)'？/a/divCSS代码：

这里列出的是这个焦点图相关的核心半铸钢钢性铸铁(铸造半钢)代码。滑块部分{ display:无}。滑块部分。第一个{显示器： }块；}.滑块部分，滑块截面截面{ width : 861 pxh three : 335 px }。滑块部分{ margin: 0 auto相对位置：}.滑块部分