jQuery补充，基于jQuery的bxslider轮播器插件

基于jQuery的bxslider轮播器插件

html

DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
    <title>bxslider介绍title>
    
    <link rel="stylesheet" href="bxslider/jquery.bxslider.min.css">
head>
<body>

<ul class="bxslider">
    <li><img src="http://placehold.it/350x150&text=FooBar1"/>li>
    <li><img src="http://placehold.it/350x150&text=FooBar2"/>li>
    <li><img src="http://placehold.it/350x150&text=FooBar3"/>li>
ul>

<div class="slider1">
    <div class="slide"><img src="http://placehold.it/350x150&text=FooBar1">div>
    <div class="slide"><img src="http://placehold.it/350x150&text=FooBar2">div>
    <div class="slide"><img src="http://placehold.it/350x150&text=FooBar3">div>
    <div class="slide"><img src="http://placehold.it/350x150&text=FooBar4">div>
    <div class="slide"><img src="http://placehold.it/350x150&text=FooBar5">div>
    <div class="slide"><img src="http://placehold.it/350x150&text=FooBar6">div>
    <div class="slide"><img src="http://placehold.it/350x150&text=FooBar7">div>
    <div class="slide"><img src="http://placehold.it/350x150&text=FooBar8">div>
    <div class="slide"><img src="http://placehold.it/350x150&text=FooBar9">div>
div>

<div class="slider8">
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar1">div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar2">div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar3">div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar4">div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar5">div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar6">div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar7">div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar8">div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar9">div>
  <div class="slide"><img src="http://placehold.it/300x100&text=FooBar10">div>
div>

<script src="jquery/jquery.min.js">script>

<script src="bxslider/jquery.bxslider.min.js">script>
<script src="ceshi.js">script>
body>
html>

/**
 * Created by admin on 2017/5/2.
 */
$(function () {
    //
    $('.bxslider').bxSlider({auto: true, autoControls: true});

    //
    $('.slider1').bxSlider({auto: true, slideWidth: 200, minSlides: 2, maxSlides: 3, slideMargin: 10});

    //
    $('.slider8').bxSlider({
        mode: 'vertical',
        slideWidth: 300,
        minSlides: 2,
        slideMargin: 10
    });
});

官方网站：http://bxslider.com/

Python

jQuery补充，基于jQuery的bxslider轮播器插件

相关

学习《Python编程从入门到实践》PDF+代码训练

python-----面向对象简单理解

python多线程控制

Sublime 的安装、汉化、配置、Python环境和插件

python——time strftime() 函数表示当地时间

python 初识函数

python 函数对象嵌套闭包

Python栈溢出——设置python栈大小

python-面向对象-01课堂笔记

python爬虫

Python 之父的解析器系列之五：左递归 PEG 语法

Python 为了提升性能，竟运用了共享经济

标签