首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

javaScript+turn.js实现图书翻页效果实例代码

Posted in Javascript onFebruary 16, 2017

为了实现图书翻页的效果我们在网上可以看到很多教程 在这里推荐turn.js 网上的turn.js 有api 不过是英文的  很多人看起来不方便 .关于代码也是奇形怪状在这里我将详细讲解如何使用turn.js实现翻页效果 ,本篇文章只是讲解 turn.js 如何使用！！！！！！！ 文章最后提供源码下载，结合源码看本文，turn.js更简单！

首先附上个人的文件路径

javaScript+turn.js实现图书翻页效果实例代码

对于css   和 js文件不需要过多的解释   在这里要注意的是pages文件夹   这里个文件夹下放的是需要预览的图片文件    所以
我们想展示的资源  就放在这个目录下面！！！！！！    

接下来  先给大家看一下pages下面的资源名称

javaScript+turn.js实现图书翻页效果实例代码

可以看到  所有的资源都以数字命名  至于为什么  我们在之后会讲解

接下来  我们开始使将turn.js结合到我们自己的项目中  先附上index.html中的代码

<!doctype html><!--[if lt IE 7 ]> 
<html lang="en" class="ie6"> 
<![endif]--><!--[if IE 7 ]> 
<html lang="en" class="ie7"> 
<![endif]--><!--[if IE 8 ]> 
<html lang="en" class="ie8"> 
<![endif]--><!--[if IE 9 ]> 
<html lang="en" class="ie9"> 
<![endif]--><!--[if !IE]> 
<!--> 
<html lang="en"> 
<!--<![endif]--> 
<head> 
 <title>Using turn.js and the new zoom feature</title> 
 <meta name="viewport" content="width = 1050, user-scalable = no"/> 
 <link href="css/magazine.css" rel="external nofollow" rel="external nofollow" rel="stylesheet" type="text/css"> 
 <script type="text/javascript" src="js/jquery.min.1.7.js"></script> 
 <script type="text/javascript" src="js/modernizr.2.5.3.min.js"></script> 
 <script type="text/javascript" src="js/hash.js"></script> 
 <script type="text/javascript" src="js/turn.js"></script> 
 <script type="text/javascript" src="js/turn.html4.min.js"></script> 
 <script type="text/javascript" src="js/zoom.min.js"></script> 
 <script type="text/javascript" src="js/magazine.js"></script> 
 <script> 
 $(function () { 
  var next_button = $(".next-button");  //初始化左右箭头 
  var previous_button = $(".previous-button"); 
  setArrows(); 
 }); 
 </script> 
</head> 
<body> 
<div id="canvas"> 
 <!-- 右上角放大缩小按钮 --> 
 <div class="zoom-icon zoom-icon-in"> 
 </div> 
 <div class="magazine-viewport"> 
 <div class="container"> 
  <div class="magazine"> 
  <!-- Next button --></div> 
 </div> 
 <div ignore="1" class="next-button"> 
 </div> 
 <!-- Previous button --> 
 <div ignore="1" class="previous-button"> 
 </div> 
 </div> 
 <script type="text/javascript"> 
 function loadApp() { 
  $('#canvas').fadeIn(1000); 
  var flipbook = $('.magazine'); 
  // Check if the CSS was already loaded 
  if (flipbook.width() == 0 || flipbook.height() == 0) { 
  setTimeout(loadApp, 10); 
  return; 
  } 
  // 创建flipbook 
  flipbook.turn({ 
  width: 1200, 
  height: 781, 
  duration: 1000, //翻页速度，值越小越快 
  // Hardware acceleration 
  acceleration: !isChrome(), 
  // Enables gradients 
  gradients: true, 
  // Auto center this flipbook 
  autoCenter: true, 
  // Elevation from the edge of the flipbook when turning a page 
  elevation: 50, 
  // The number of pages 
  pages: 8, 
  // Events 
  when: { 
   turning: function (event, page, view) { 
   var book = $(this), 
    currentPage = book.turn('page'), 
    pages = book.turn('pages'); 
   // Update the current URI 
   Hash.go('page/' + page).update(); 
   // Show and hide navigation buttons 
   disableControls(page); 
   }, 
   turned: function (event, page, view) { 
   disableControls(page); 
   $(this).turn('center'); 
   if (page == 1) { 
    $(this).turn('peel', 'br'); 
   } 
   }, 
   missing: function (event, pages) { 
   // Add pages that aren't in the magazine 
   for (var i = 0; i < pages.length; i++) 
    addPage(pages[i], $(this)); 
   } 
  } 
  }); 
  // Zoom.js 
  $('.magazine-viewport').zoom({ 
  flipbook: $('.magazine'), 
  max: function () { 
   return largeMagazineWidth() / $('.magazine').width(); 
  }, 
  when: { 
   swipeLeft: function () { 
   $(this).zoom('flipbook').turn('next'); 
   }, 
   swipeRight: function () { 
   $(this).zoom('flipbook').turn('previous'); 
   }, 
   resize: function (event, scale, page, pageElement) { 
   if (scale == 1) 
    loadSmallPage(page, pageElement); 
   else 
    loadLargePage(page, pageElement); 
   }, 
   zoomIn: function () { 
   $('.made').hide(); 
   $('.magazine').removeClass('animated').addClass('zoom-in'); 
   $('.zoom-icon').removeClass('zoom-icon-in').addClass('zoom-icon-out'); 
   if (!window.escTip && !$.isTouch) { 
    escTip = true; 
    $('<div />', {'class': 'exit-message'}). 
    html('<div>Press ESC to exit</div>'). 
    appendTo($('body')). 
    delay(2000). 
    animate({opacity: 0}, 500, function () { 
    $(this).remove(); 
    }); 
   } 
   }, 
   zoomOut: function () { 
   $('.exit-message').hide(); 
   $('.thumbnails').fadeIn(); 
   $('.made').fadeIn(); 
   $('.zoom-icon').removeClass('zoom-icon-out').addClass('zoom-icon-in'); 
   setTimeout(function () { 
    $('.magazine').addClass('animated').removeClass('zoom-in'); 
    resizeViewport(); 
   }, 0); 
   } 
  } 
  }); 
  // Zoom event 
  if ($.isTouch) 
  $('.magazine-viewport').bind('zoom.doubleTap', zoomTo); 
  else 
  $('.magazine-viewport').bind('zoom.tap', zoomTo); 
  // Using arrow keys to turn the page 
  $(document).keydown(function (e) { 
  var previous = 37, next = 39, esc = 27; 
  switch (e.keyCode) { 
   case previous: 
   // left arrow 
   $('.magazine').turn('previous'); 
   e.preventDefault(); 
   break; 
   case next: 
   //right arrow 
   $('.magazine').turn('next'); 
   e.preventDefault(); 
   break; 
   case esc: 
   $('.magazine-viewport').zoom('zoomOut'); 
   e.preventDefault(); 
   break; 
  } 
  }); 
  // URIs - Format #/page/1 
  Hash.on('^page\/([0-9]*)$', { 
  yep: function (path, parts) { 
   var page = parts[1]; 
   if (page !== undefined) { 
   if ($('.magazine').turn('is')) 
    $('.magazine').turn('page', page); 
   } 
  }, 
  nop: function (path) { 
   if ($('.magazine').turn('is')) 
   $('.magazine').turn('page', 1); 
  } 
  }); 
  $(window).resize(function () { 
  resizeViewport(); 
  }).bind('orientationchange', function () { 
  resizeViewport(); 
  }); 
  // Events for thumbnails 
  $('.thumbnails').click(function (event) { 
  var page; 
  if (event.target && (page = /page-([0-9]+)/.exec($(event.target).attr('class')))) { 
   $('.magazine').turn('page', page[1]); 
  } 
  }); 
  $('.thumbnails li'). 
  bind($.mouseEvents.over, function () { 
  $(this).addClass('thumb-hover'); 
  }).bind($.mouseEvents.out, function () { 
  $(this).removeClass('thumb-hover'); 
  }); 
  if ($.isTouch) { 
  $('.thumbnails'). 
  addClass('thumbanils-touch'). 
  bind($.mouseEvents.move, function (event) { 
   event.preventDefault(); 
  }); 
  } else { 
  $('.thumbnails ul').mouseover(function () { 
   $('.thumbnails').addClass('thumbnails-hover'); 
  }).mousedown(function () { 
   return false; 
  }).mouseout(function () { 
   $('.thumbnails').removeClass('thumbnails-hover'); 
  }); 
  } 
  // Regions 
  if ($.isTouch) { 
  $('.magazine').bind('touchstart', regionClick); 
  } else { 
  $('.magazine').click(regionClick); 
  } 
  // Events for the next button 
  $('.next-button').bind($.mouseEvents.over, function () { 
  $(this).addClass('next-button-hover'); 
  }).bind($.mouseEvents.out, function () { 
  $(this).removeClass('next-button-hover'); 
  }).bind($.mouseEvents.down, function () { 
  $(this).addClass('next-button-down'); 
  }).bind($.mouseEvents.up, function () { 
  $(this).removeClass('next-button-down'); 
  }).click(function () { 
  $('.magazine').turn('next'); 
  setTimeout(function () { 
   setArrows(); 
  }, 300); 
  }); 
  // Events for the next button 
  $('.previous-button').bind($.mouseEvents.over, function () { 
  $(this).addClass('previous-button-hover'); 
  }).bind($.mouseEvents.out, function () { 
  $(this).removeClass('previous-button-hover'); 
  }).bind($.mouseEvents.down, function () { 
  $(this).addClass('previous-button-down'); 
  }).bind($.mouseEvents.up, function () { 
  $(this).removeClass('previous-button-down'); 
  }).click(function () { 
  $('.magazine').turn('previous'); 
  setTimeout(function () { 
   setArrows(); 
  }, 300); 
  }); 
  resizeViewport(); 
  $('.magazine').addClass('animated'); 
 } 
 // Zoom icon 
 $('.zoom-icon').bind('mouseover', function () { 
  if ($(this).hasClass('zoom-icon-in')) 
  $(this).addClass('zoom-icon-in-hover'); 
  if ($(this).hasClass('zoom-icon-out')) 
  $(this).addClass('zoom-icon-out-hover'); 
 }).bind('mouseout', function () { 
  if ($(this).hasClass('zoom-icon-in')) 
  $(this).removeClass('zoom-icon-in-hover'); 
  if ($(this).hasClass('zoom-icon-out')) 
  $(this).removeClass('zoom-icon-out-hover'); 
 }).bind('click', function () { 
  if ($(this).hasClass('zoom-icon-in')) 
  $('.magazine-viewport').zoom('zoomIn'); 
  else if ($(this).hasClass('zoom-icon-out')) 
  $('.magazine-viewport').zoom('zoomOut'); 
 }); 
 $('#canvas').hide(); 
 // Load the HTML4 version if there's not CSS transform 
 yepnope({ 
  test: Modernizr.csstransforms, 
  yep: ['js/turn.js'], 
  nope: ['js/turn.html4.min.js'], 
  both: ['js/zoom.min.js', 'js/magazine.js', 'css/magazine.css'], 
  complete: loadApp 
 }); 
 </script> 
</div> 
</body> 
</html> 
<![endif]--></div> 
</html> 
</html> 
</html> 
</html>

一：在其中值得注意的是：对于js的引用 有两处！ 

1：是开头这里引用了css和js

<link href="css/magazine.css" rel="external nofollow" rel="external nofollow" rel="stylesheet" type="text/css"> 
<script type="text/javascript" src="js/jquery.min.1.7.js"></script> 
<script type="text/javascript" src="js/modernizr.2.5.3.min.js"></script> 
<script type="text/javascript" src="js/hash.js"></script> 
<script type="text/javascript" src="js/turn.js"></script> 
<script type="text/javascript" src="js/turn.html4.min.js"></script> 
<script type="text/javascript" src="js/zoom.min.js"></script> 
<script type="text/javascript" src="js/magazine.js"></script>

2：则是index.html的最下方，这里极容易被忽视！！！切记路径不可错误，不然报错！！！！

// Load the HTML4 version if there's not CSS transform 
yepnope({ 
 test: Modernizr.csstransforms, 
 yep: ['js/turn.js'], 
 nope: ['js/turn.html4.min.js'], 
 both: ['js/zoom.min.js', 'js/magazine.js', 'css/magazine.css'], 
 complete: loadApp 
});

二：js中的magazine.js   这个js值整个功能实现的支柱   在这里提供了所有的函数。

/* 
 * Magazine sample 
*/ 
//这里是对前页后页的位置设定 
function setArrows() { 
 /*var width = $(window).width(); 
 //alert("chushihua"+width); 
 var height = $(window).height(); 
 var bookWidth = $(".magazine").width(); 
 var bookHeight = $(".magazine").height(); 
 //alert("chushihua"+bookWidth); 
 var arrowSize = $(".next-button").width(); 
 //alert(arrowSize); 
 alert($(".magazine").offset().left+"\n"+$('.next-button').offset().left); 
 var LeftArrowLeft = - ( width - bookWidth ) / 4 + 'px' ; 
 //alert(LeftArrowLeft); 
 var RightArrowLeft = - ( width - bookWidth+ arrowSize*2) / 4 + 'px' ; 
 //alert(RightArrowLeft); 
 //alert(RightArrowLeft); 
 //alert("zhihou"+bookWidth); 
 $('.next-button').css( "right",RightArrowLeft ); 
 $('.previous-button').css( "left", LeftArrowLeft );*/ 
 setTimeout(function(){ 
 var width = $(window).width(); 
 var bookWidth = $(".magazine").width(); 
 var arrowSize = $(".next-button").width(); 
 var magaLeft=$(".magazine").offset().left; 
 var nextLeft= (width-bookWidth-magaLeft-60)/2; 
 //alert("width "+width +"\nbookWidth :"+bookWidth +"\nmagaLeft:"+magaLeft+"\nnextLeft:"+nextLeft); 
 $('.next-button').animate({ "right":nextLeft},300); 
 $('.previous-button').animate({ "left":nextLeft},300); 
 },100); 
} 
//这是用于加载所有的待展示资源 
function addPage(page, book) { 
 var id, pages = book.turn('pages'); 
 // Create a new element for this page 
 var element = $('<div />', {}); 
 // Add the page to the flipbook 
 if (book.turn('addPage', element, page)) { 
 // Add the initial HTML 
 // It will contain a loader indicator and a gradient 
 element.html('<div class="gradient"></div><div class="loader"></div>'); 
 // Load the page 
 loadPage(page, element); 
 } 
} 
function loadPage(page, pageElement) { 
 // Create an image element 
 var img = $('<img />'); 
 img.mousedown(function(e) { 
 e.preventDefault(); 
 }); 
 img.load(function() { 
 // Set the size 
 $(this).css({ 
  width: '100%', 
  height: '100%' 
 }); 
 // Add the image to the page after loaded 
 $(this).appendTo(pageElement); 
 // Remove the loader indicator 
 pageElement.find('.loader').remove(); 
 }); 
 // Load the page 
 img.attr('src', 'pages/' + page + '.png');//这里就是指向展示资源路径，pages/即之前提及的pages文件夹，根据需要可更换。 
 loadRegions(page, pageElement); 
} 
// 这里是识别预览大图还是小图的模式1为大图 
function zoomTo(event) { 
 setTimeout(function() { 
 if ($('.magazine-viewport').data().regionClicked) { 
  $('.magazine-viewport').data().regionClicked = false; 
 } else { 
  if ($('.magazine-viewport').zoom('value') == 1) { 
  $('.magazine-viewport').zoom('zoomIn', event); 
  } else { 
  $('.magazine-viewport').zoom('zoomOut'); 
  } 
 } 
 }, 
 1); 
} 
// 不需了解 
function loadRegions(page, element) { 
 $.getJSON('pages/' + page + '-regions.json').done(function(data) { 
 $.each(data, 
 function(key, region) { 
  addRegion(region, element); 
 }); 
 }); 
} 
// 不需了解 
function addRegion(region, pageElement) { 
 var reg = $('<div />', { 
 'class': 'region ' + region['class'] 
 }), 
 options = $('.magazine').turn('options'), 
 pageWidth = options.width / 2, 
 pageHeight = options.height; 
 reg.css({ 
 top: Math.round(region.y / pageHeight * 100) + '%', 
 left: Math.round(region.x / pageWidth * 100) + '%', 
 width: Math.round(region.width / pageWidth * 100) + '%', 
 height: Math.round(region.height / pageHeight * 100) + '%' 
 }).attr('region-data', $.param(region.data || '')); 
 reg.appendTo(pageElement); 
} 
function regionClick(event) { 
 var region = $(event.target); 
 if (region.hasClass('region')) { 
 $('.magazine-viewport').data().regionClicked = true; 
 setTimeout(function() { 
  $('.magazine-viewport').data().regionClicked = false; 
 }, 
 100); 
 var regionType = $.trim(region.attr('class').replace('region', '')); 
 return processRegion(region, regionType); 
 } 
} 
// 不需了解 
function processRegion(region, regionType) { 
 data = decodeParams(region.attr('region-data')); 
 switch (regionType) { 
 case 'link': 
 window.open(data.url); 
 break; 
 case 'zoom': 
 var regionOffset = region.offset(), 
 viewportOffset = $('.magazine-viewport').offset(), 
 pos = { 
  x: regionOffset.left - viewportOffset.left, 
  y: regionOffset.top - viewportOffset.top 
 }; 
 $('.magazine-viewport').zoom('zoomIn', pos); 
 break; 
 case 'to-page': 
 $('.magazine').turn('page', data.page); 
 break; 
 } 
} 
// 加载大图 
function loadLargePage(page, pageElement) { 
 var img = $('<img />'); 
 img.load(function() { 
 var prevImg = pageElement.find('img'); 
 $(this).css({ 
  width: '100%', 
  height: '100%' 
 }); 
 $(this).appendTo(pageElement); 
 prevImg.remove(); 
 }); 
 // Loadnew page 
 img.attr('src', 'pages/' + page + '-large.png');//这里指向大图路径，当点击预览大图的时候，加载该路径，可根据需要更换。 
} 
// 加载小图 
function loadSmallPage(page, pageElement) { 
 var img = pageElement.find('img'); 
 img.css({ 
 width: '100%', 
 height: '100%' 
 }); 
 img.unbind('load'); 
 // Loadnew page 
 img.attr('src', 'pages/' + page + '.png');//指向小图路径，同上 
} 
// 判断浏览器 
function isChrome() { 
 return navigator.userAgent.indexOf('Chrome') != -1; 
} 
function disableControls(page) { 
 if (page == 1) $('.previous-button').hide(); 
 else $('.previous-button').show(); 
 if (page == $('.magazine').turn('pages')) $('.next-button').hide(); 
 else $('.next-button').show(); 
} 
// 为图书设置宽高 
function resizeViewport() { 
 var width = $(window).width(), 
 height = $(window).height(), 
 options = $('.magazine').turn('options'); 
 $('.magazine').removeClass('animated'); 
 $('.magazine-viewport').css({ 
 width: width, 
 height: height 
 }).zoom('resize'); 
 setArrows() ; 
 if ($('.magazine').turn('zoom') == 1) { 
 var bound = calculateBound({ 
  width: options.width, 
  height: options.height, 
  boundWidth: Math.min(options.width, width), 
  boundHeight: Math.min(options.height, height) 
 }); 
 if (bound.width % 2 !== 0) bound.width -= 1; 
 if (bound.width != $('.magazine').width() || bound.height != $('.magazine').height()) { 
  $('.magazine').turn('size', bound.width, bound.height); 
  if ($('.magazine').turn('page') == 1) $('.magazine').turn('peel', 'br'); 
 } 
 $('.magazine').css({ 
  top: -bound.height / 2, 
  left: -bound.width / 2 
 }); 
 } 
 var magazineOffset = $('.magazine').offset(), 
 boundH = height - magazineOffset.top - $('.magazine').height(), 
 marginTop = (boundH - $('.thumbnails > div').height()) / 2; 
 if (marginTop < 0) { 
 $('.thumbnails').css({ 
  height: 1 
 }); 
 } else { 
 $('.thumbnails').css({ 
  height: boundH 
 }); 
 $('.thumbnails > div').css({ 
  marginTop: marginTop 
 }); 
 } 
 if (magazineOffset.top < $('.made').height()) $('.made').hide(); 
 else $('.made').show(); 
 $('.magazine').addClass('animated'); 
} 
//这里用于返回待预览资源的个数（即书本的页数） 
function numberOfViews(book) { 
 return book.turn('pages') / 2 + 1; 
} 
// 当前页 
function getViewNumber(book, page) { 
 return parseInt((page || book.turn('page')) / 2 + 1, 10); 
} 
// 记录宽度 
function largeMagazineWidth() { 
 return 2214; 
} 
function decodeParams(data) { 
 var parts = data.split('&'), 
 d, 
 obj = {}; 
 for (var i = 0; i < parts.length; i++) { 
 d = parts[i].split('='); 
 obj[decodeURIComponent(d[0])] = decodeURIComponent(d[1]); 
 } 
 return obj; 
} 
function calculateBound(d) { 
 var bound = { 
 width: d.width, 
 height: d.height 
 }; 
 if (bound.width > d.boundWidth || bound.height > d.boundHeight) { 
 var rel = bound.width / bound.height; 
 if (d.boundWidth / rel > d.boundHeight && d.boundHeight * rel <= d.boundWidth) { 
  bound.width = Math.round(d.boundHeight * rel); 
  bound.height = d.boundHeight; 
 } else { 
  bound.width = d.boundWidth; 
  bound.height = Math.round(d.boundWidth / rel); 
 } 
 } 
 return bound; 
}

在掌握到这些后  便可使用turn.js

最后   展示一下实现的效果，很流畅！！！！

附上源码地址：

以上所述是小编给大家介绍的javaScript+turn.js实现图书翻页效果实例代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持！

javaScript+turn.js实现图书翻页效果实例代码

- Author -

zwh-android&&java

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
Javascript UrlDecode函数代码
Jan 09 Javascript
面向对象的Javascript之三(封装和信息隐藏)
Jan 27 Javascript
一款由jquery实现的整屏切换特效
Sep 15 Javascript
js显示动态时间的方法详解
Aug 20 Javascript
微信小程序 WXML、WXSS 和JS介绍及详解
Oct 08 Javascript
JavaScript中object和Object的区别(详解)
Feb 27 Javascript
js异步编程小技巧详解
Aug 14 Javascript
JavaScript实现三级级联特效
Nov 05 Javascript
js原生方法被覆盖,从新赋值原生的方法
Jan 02 Javascript
jsonp跨域及实现百度首页联想功能的方法
Aug 30 Javascript
解决antd 下拉框 input [defaultValue] 的值的问题
Oct 31 Javascript
JS + HTML 罗盘式时钟的实现
May 21 Javascript
原生JS实现图片翻书效果
Feb 16 #Javascript
js 单引号替换成双引号,双引号替换成单引号的实现方法
Feb 16 #Javascript
js+html制作简单验证码
Feb 16 #Javascript
Vue 仿百度搜索功能实现代码
Feb 16 #Javascript
javascript实现秒表计时器的制作方法
Feb 16 #Javascript
jQuery实现搜索页面关键字的功能
Feb 16 #Javascript
canvas时钟效果
Feb 16 #Javascript
exists(2) 慢日志(1) cmd(1) 相对路径(1) REST(1) 面向对象(3) 相对路径 (1) Mint UI(1) mt-swipe(1) openpyxl(1)
You might like
PHP详解ASCII码对照表与字符转换
2011/12/05 PHP
PHP利用REFERER根居访问来地址进行页面跳转
2013/09/28 PHP
Laravel 5 框架入门（四）完结篇
2015/04/09 PHP
PHP人民币金额转大写实例代码
2015/10/02 PHP
THinkPHP获取客户端IP与IP地址查询的方法
2016/11/14 PHP
用JavaScript事件串连执行多个处理过程的方法
2007/03/09 Javascript
经典海量jQuery插件 大家可以收藏一下
2010/02/07 Javascript
一个报数游戏js版(约瑟夫环问题)
2010/08/05 Javascript
JavaScript实现拼音排序的方法
2012/11/20 Javascript
JS小游戏之象棋暗棋源码详解
2014/09/25 Javascript
jQuery中ajax的load()方法用法实例
2014/12/26 Javascript
通过JS判断联网类型和连接状态的实现代码
2015/04/01 Javascript
JS数组合并push与concat区别分析
2015/12/17 Javascript
基于BootStrap的图片轮播效果展示实例代码
2016/05/23 Javascript
easyui combotree加载静态数据问题（选不上）解决方法
2016/12/26 Javascript
JS实现数组按升序及降序排列的方法
2017/04/26 Javascript
为vue-router懒加载时下载js的过程中添加loading提示避免无响应问题
2018/04/03 Javascript
vue npm install 安装某个指定的版本操作
2020/08/11 Javascript
使用vue编写h5公众号跳转小程序的实现代码
2020/11/27 Vue.js
[03:18]DOTA2亚洲邀请赛小组赛第一日 RECAP赛事回顾
2015/01/30 DOTA
python在文本开头插入一行的实例
2018/05/02 Python
Python常用字符串替换函数strip、replace及sub用法示例
2018/05/21 Python
对numpy中数组转置的求解以及向量内积计算方法
2018/10/31 Python
详解Matplotlib绘图之属性设置
2019/08/23 Python
Python实现Keras搭建神经网络训练分类模型教程
2020/06/12 Python
python 还原梯度下降算法实现一维线性回归
2020/10/22 Python
会计主管岗位职责范文
2013/11/08 职场文书
付款委托书范本
2014/04/04 职场文书
优秀会计求职信
2014/07/04 职场文书
银行党的群众路线教育实践活动对照检查材料
2014/09/25 职场文书
领导干部查摆“四风”问题自我剖析材料思想汇报
2014/10/05 职场文书
大学生村官个人总结
2015/02/15 职场文书
优秀乡村医生事迹材料（2016精选版）
2016/02/29 职场文书
【海涛教你打DOTA】死灵飞龙第一视角解说
2022/04/01 DOTA
linux目录管理方法介绍
2022/06/01 Servers
让JavaScript代码更加精简的方法技巧
2022/06/01 Javascript