简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home> Web Front-end> JS Tutorial> body text

原生js实现移动开发轮播图、相册滑动特效_javascript技巧

WBOY
Release： 2016-05-16 16:03:21
Original
1436 people have browsed it

使用方法：

分别引用css文件和js文件 如：
Copy after login

html:

  • 原生js实现移动开发轮播图、相册滑动特效_javascript技巧
    •  
  • 原生js实现移动开发轮播图、相册滑动特效_javascript技巧
    •  
  • 原生js实现移动开发轮播图、相册滑动特效_javascript技巧
    • Copy after login

    javascript:

    window.onload=function(){ photoSlide({ wrap: document.getElementById('photo'),//最外层容器 loop: true,//设置无缝循环 autoPlay:true,//自动轮播 autoTime:4000,//轮播时间间隔 pagination:true //点状态列表 }); }
    Copy after login

    完整示例：

              
          photoSlider-纯js移动开发轮播图、相册滑动插件
          
          
          
          
          
          
          
          
          
          
          
          
    
           
    
            
           
    
          
    
          
    
           
    
            
           
    
          
    
          
    
           
           
      
            
    • 原生js实现移动开发轮播图、相册滑动特效_javascript技巧
      •  
    • 原生js实现移动开发轮播图、相册滑动特效_javascript技巧
      •  
    • 原生js实现移动开发轮播图、相册滑动特效_javascript技巧
      •
    Copy after login

    以上所述就是本文的全部内容了，希望大家能够喜欢。

    Related labels：
    Image Carousel
    source：php.cn
    Previous article：JavaScript控制网页平滑滚动到指定元素位置的方法_javascript技巧 Next article：js实现touch移动触屏滑动事件_javascript技巧
    Statement of this Website
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
    Latest Articles by Author
    Latest Issues
    function_exists() cannot determine the custom function Function test () {return true;} if (function_exists ('test')) {echo "test is function...
    From 2024-04-29 11:01:01
    0
    2
    1008
    How to display the mobile version of Google Chrome Hello teacher, how can I change Google Chrome into a mobile version?
    From 2024-04-23 00:22:19
    0
    9
    1079
    The child window operates the parent window, but the output does not respond. The first two sentences are executable, but the last sentence cannot be implemented.
    From 2024-04-19 15:37:47
    0
    1
    978
    There is no output in the parent window document.onclick = function(){ window.opener.document.write('I am the output of the child ...
    From 2024-04-18 23:52:34
    0
    1
    842
    Where is the courseware about CSS mind mapping? Courseware
    From 2024-04-16 10:10:18
    0
    0
    915
    Related Topics
    More>
    Popular Recommendations
    Popular Tutorials
    More>
    Related Tutorials
    Popular Recommendations
    Latest courses
    Latest Downloads
    More>
    Web Effects
    Website Source Code
    Website Materials
    Front End Template
    About us Disclaimer Sitemap
    php.cn：Public welfare online PHP training，Help PHP learners grow quickly！