首页>>Jquery图片>>非Jquery自适应屏幕图片轮播插件(2018-09-28)

非Jquery自适应屏幕图片轮播插件

非Jquery自适应屏幕图片轮播插件
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div id="jssor_1" style="position:relative;margin:0 auto;top:50px;left:0px;width:980px;height:380px;overflow:hidden;visibility:hidden;">  
  2.   
  3. <div data-u="loading" class="jssorl-009-spin" style="position:absolute;top:0px;left:0px;width:100%;height:100%;text-align:center;background-color:rgba(0,0,0,0.7);"> <img style="margin-top:-19px;position:relative;top:50%;width:38px;height:38px;" src="img/spin.svg" /> </div>  
  4. <div data-u="slides" style="cursor:default;position:relative;top:0px;left:0px;width:980px;height:380px;overflow:hidden;">  
  5. <div data-p="170.00"> <img data-u="image" src="3.png" /> </div>  
  6. <div data-p="170.00"> <img data-u="image" src="2.png" /> </div>  
  7. <div data-p="170.00"> <img data-u="image" src="1.png" /> </div>  
  8. </div>  
  9.   
  10. <div data-u="navigator" class="jssorb051" style="position:absolute;bottom:12px;right:12px;" data-autocenter="1" data-scale="0.5" data-scale-bottom="0.75">  
  11. <div data-u="prototype" class="i" style="width:16px;height:16px;">  
  12. <svg viewbox="0 0 16000 16000" style="position:absolute;top:0;left:0;width:100%;height:100%;">  
  13. <circle class="b" cx="8000" cy="8000" r="5800"></circle>  
  14. </svg>  
  15. </div>  
  16. </div>  
  17.   
  18. <div data-u="arrowleft" class="jssora051" style="width:55px;height:55px;top:0px;left:25px;" data-autocenter="2" data-scale="0.75" data-scale-left="0.75">  
  19. <svg viewbox="0 0 16000 16000" style="position:absolute;top:0;left:0;width:100%;height:100%;">  
  20. <polyline class="a" points="11040,1920 4960,8000 11040,14080 "></polyline>  
  21. </svg>  
  22. </div>  
  23. <div data-u="arrowright" class="jssora051" style="width:55px;height:55px;top:0px;right:25px;" data-autocenter="2" data-scale="0.75" data-scale-right="0.75">  
  24. <svg viewbox="0 0 16000 16000" style="position:absolute;top:0;left:0;width:100%;height:100%;">  
  25. <polyline class="a" points="4960,1920 11040,8000 4960,14080 "></polyline>  
  26. </svg>  
  27. </div>  
  28. </div>  
  29. <script type="text/javascript">jssor_1_slider_init();</script>  

 


原文地址:http://www.freejs.net/article_jquerytupiantexiao_697.html