turnjs图册翻书效果

npm install https://github.com/igghera/turn.js.git
//或者
npm install turn.js //import $ from "jquery"; //记得引入jquery
import 'turn.js'; // 引入 Turn.jsimport turn from "@/utils/turn.min.js";// 引入 Turn.js
initBook(length) {var that = this;that.$nextTick(() => {const book = that.$refs.book;that.totalPages = length;$(book).turn({acceleration: true,display: "double",duration: 800,page: 2,gradients: true,pages: $(book).children().length,turnCorners: "bl,br,tl,tr,l,r",elevation: 300,autoCenter: true,peel: "tr",width: 1272,height: 896,when: {turned: (e, page) => {that.currentPage = page;},},});});},

{
  "name": "turn.js",
  "version": "1.0.5",
  "description": "Web page flipper",
  "main": "index.js",
  "repository": "https://github.com/igghera/turn.js.git",
  "author": "Andrea Gherardi <a.gherardi@cantierecreativo.net>",
  "license": "MIT",
  "dependencies": {
    "jquery": "1.12.0"
  }
}
 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/74345.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

用PostgreSQL玩转俄罗斯方块:当SQL成为游戏引擎

当DBA开始摸鱼2025年某深夜&#xff0c;一位不愿透露姓名的DBA为了在监控大屏上隐藏游戏行为&#xff0c;竟用SQL实现了俄罗斯方块&#xff01;从此&#xff0c;SELECT成了方向键&#xff0c;UPDATE成了旋转指令&#xff0c;DELETE成了消除大招。本文将揭秘这个疯狂项目的技术内…

计算机网络层超全解析:从IP协议到路由算法

&#x1f310; &#xff08;专业详解生活化类比&#xff0c;逻辑一镜到底&#xff09; &#x1f4d6; 网络层的核心使命 核心任务&#xff1a;在不同网络间为数据包选择最佳路径&#xff0c;实现端到端通信。 类比&#xff1a;快递公司总部&#xff08;网络层&#xff09;根据…

代码随想录算法训练营第38天 | 322. 零钱兑换 279.完全平方数 139.单词拆分 背包问题总结

322. 零钱兑换 如果求组合数就是外层for循环遍历物品&#xff0c;内层for遍历背包。 如果求排列数就是外层for遍历背包&#xff0c;内层for循环遍历物品。 钱币有顺序和没有顺序都可以&#xff0c;都不影响钱币的最小个数。 视频讲解&#xff1a;动态规划之完全背包&#xff0…

关于网络的一点知识(持续更新)

1、IP地址和子网掩码、端口号: IP地址是设备在网络上的地址,相当于一栋房子的门牌号。子网掩码相当于房子所在的街道。同一条街道的房子间是通过街道直通的,主人可以互相拜访。 举个例子,如下图所示。 说明:将两台设备的IP和子网掩码转化为二进制,然后将各自的IP地址和…

Idea中使用Git插件_合并当前分支到master分支_冲突解决_很简单---Git工作笔记005

由于之前用svn习惯了,用的git少,其实在idea中使用git,解决冲突,合并分支,非常的简单,一起来看一下吧. 一定要注意操作之前,一定要确保自己的分支代码,都已经commit提交了,并且push到远程了. 不要丢东西. 可以看到首先,在idea的左下角有个 git,点开以后 可以看到有显示的分支…

[自动化] 【八爪鱼】使用八爪鱼实现CSDN文章自动阅读脚本

在CSDN上&#xff0c;文章的阅读量往往是衡量内容影响力的一个重要指标。为了测试自动化手段能否提高阅读数&#xff0c;我尝试使用网页自动化工具来模拟人工阅读某个ID的文章。 1. 网页自动化的常见方案 谈到网页自动化&#xff0c;Selenium 是一个最常见的选择。它可以通过…

Linux 系统性能优化高级全流程指南

Linux 系统性能优化高级全流程指南 一、系统基础状态捕获 1. 系统信息建档 除了原有的硬件、内核和存储拓扑信息收集&#xff0c;还增加 CPU 缓存、网络设备详细信息等。 # 硬件信息 lscpu > /opt/tuning/lscpu.origin dmidecode -t memory > /opt/tuning/meminfo.or…

常⻅中间件漏洞--Tomcat

tomcat是⼀个开源⽽且免费的jsp服务器&#xff0c;默认端⼝ : 8080&#xff0c;属于轻量级应⽤服务器。它可以实现 JavaWeb程序的装载&#xff0c;是配置JSP&#xff08;Java Server Page&#xff09;和JAVA系统必备的⼀款环境。 1.CVE-2017-12615 Tomcat put⽅法任意⽂件写…

数据结构之栈(C语言)

数据结构之栈&#xff08;C语言&#xff09; 栈1 栈的概念与结构2 栈的初始化和销毁2.1 栈的初始化2.2 栈的销毁 3 入栈函数与出栈函数3.1 入栈函数3.2 出栈函数 4 取栈顶数据&#xff0c;获取数据个数 和 判空函数4.1 取栈顶数据与获取数据个数4.1.1 取栈顶数据4.1.2 获取数据…

datawhale组队学习--大语言模型—task4:Transformer架构及详细配置

第五章 模型架构 在前述章节中已经对预训练数据的准备流程&#xff08;第 4 章&#xff09;进行了介绍。本章主 要讨论大语言模型的模型架构选择&#xff0c;主要围绕 Transformer 模型&#xff08;第 5.1 节&#xff09;、详细 配置&#xff08;第 5.2 节&#xff09;、主流架…

BP神经网络+NSGAII算法(保真)

BP神经网络NSGAII算法 非常适合用来当作实验验证自己的结论&#xff0c;构建一个神经网络模型&#xff0c;并使用NSGAII多目标优化算法来实现多领域的毕业论文的设计。仅仅使用简单的matlab代码就可以实现自己的多目标优化任务。 BP神经网络算法 我的任务是预测三个变量的值…

MCU vs SoC

MCU&#xff08;Microcontroller Unit&#xff0c;单片机&#xff09;和SoC&#xff08;System on Chip&#xff0c;片上系统&#xff09;是两种不同的芯片类型&#xff0c;尽管它们都实现了高度集成&#xff0c;但在设计目标、功能复杂性和应用场景上存在显著差异。以下是两者…

3.23学习总结

字符串 String java.lang,String 类代表字符串&#xff0c;Java程序中所有的字符串文字都为此类的对象 字符串的内容是不会发生改变的&#xff0c;它的对象在创建之后不能呗更改 字符串的内存模型 当使用双引号直接赋值时&#xff0c;系统会检查该字符串在串池中是否存在。 …

01测试分类

一、按照测试目标分类 1、界面测试 肉眼所看到的一切&#xff0c;都需要进行测试。如&#xff0c;按钮的点击&#xff1b;输入框输入文本&#xff1b;下拉框的选择&#xff1b;其它的交互等。。。 前端开发在执行开发之前需要交互/设计的同学给出设计图&#xff08;以图片的…

【Git】用Git命令克隆一个远程仓库、修改仓库中的文件,并将更改推送到远程仓库

git clone ssh://gitgithub.com:2222/Mermaid28/Groove.git # SSH地址cd rfnvtoolecho "# rfnvtool" > README.md git add README.mdgit commit -m "add README" git push -u origin master 这个一系列的 Git 命令涉及到克隆一个远程仓库、修改仓库中…

关于MTU的使用(TCP/IP网络下载慢可能与此有关)

参考链接&#xff1a;告诉你mtu值怎么设置才能网速最好&#xff01; -Win7系统之家 出现网络速度被限制&#xff0c;可能与MTU值相关&#xff0c;先查看下本机的MTU winR,然后输入&#xff1a;netsh interface ipv4 show subinterfaces &#xff0c;查看自己网络中的MTU&…

07_GRU模型

GRU模型 双向GRU笔记:https://blog.csdn.net/weixin_44579176/article/details/146459952 概念 GRU&#xff08;Gated Recurrent Unit&#xff09;也称为门控循环单元&#xff0c;是一种改进版的RNN。与LSTM一样能够有效捕捉长序列之间的语义关联&#xff0c;通过引入两个&qu…

Playwright + MCP:用AI对话重新定义浏览器自动化,效率提升300%!

一、引言&#xff1a;自动化测试的“瓶颈”与MCP的革新 传统自动化测试依赖开发者手动编写脚本&#xff0c;不仅耗时且容易因页面动态变化失效。例如&#xff0c;一个简单的登录流程可能需要开发者手动定位元素、处理等待逻辑&#xff0c;甚至反复调试超时问题。而MCP&#xf…

网络爬虫-4:jsonpath+实战

1.jsonpath 2.通过jsonpath实战 一.Jasonpath核心符号 1)$: 含义&#xff1a;表示 JSON 文档的根节点。 用法&#xff1a;所有 JSONPath 表达式都以 $ 开头&#xff0c;表示从根节点开始查询。 {"store": {"book": [{"title": "Book 1&…

GD32 ARM单片机开发规范检查清单 GD32嵌入式C代码检查清单

GD32 ARM单片机开发规范检查清单 以下检查清单基于您的编程规范制定&#xff0c;可用于代码审查和自检过程。通过逐项检查&#xff0c;确保代码符合项目规范要求。 #mermaid-svg-Ye0FEIS4ZoXDXqaH {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:…