草庐IT

swiper-bundle

全部标签

javascript - 如何在单个页面上显示多个 "Swiper"幻灯片

我正在使用SwiperSlideshow.我正在使用thisparticularversion.这是theexactcode我正在使用。添加第二个“Swiper”时,分页无法正常工作。我试着给第二个“swiper”容器一个不同的类,但它没有用。我怎样才能在同一个页面中有两个这样的东西?谢谢。 最佳答案 他们的支持给我发了这个DEMO.有用!您无需对JS文件执行任何操作。您只需要为分页添加一个额外的类,也为幻灯片添加一个额外的类,并在其他所有方面区分其余的类(参见下面的代码)。有了它,您可以在同一页面中拥有任意数量的幻灯片。Slide

javascript - D3 自定义曲线 : bundle interpolation for areas

考虑这个使用基础插值的D3JS图形:在D3JSv3中,我可以在区域上使用bundle插值(.interpolate("bundle").tension(0))来实现这种类型的渲染:注意图形的每个部分如何与其相邻部分很好地拟合。这就是我需要的。对于D3JSv4和v5,包插值的语法现在是这样的:.curve(d3.curveBundle)。但是,现在是"intendedtoworkwithd3.line,notd3.area."我最近从v3升级到v5,所以我尝试创建一个也适用于区域的自定义束曲线,以保持我喜欢v3的插值类型。我很亲近。这是我目前所拥有的://////////////////

javascript - 使用 webpack-dev-server 时 webpack 构建中缺少 bundle.js

我看了类似的,但找不到解决我问题的具体答案。我找不到bundle.js文件,即使我指定了它应该输出的位置并且一切都在浏览器中工作。我知道webpack-dev服务器正在从内存中加载文件并且没有任何内容被写入磁盘,我如何才能构建文件并将其添加到配置文件中输出属性中指定的目录?这是我的package.json:{"name":"redux-simple-starter","version":"1.0.0","description":"SimplestarterpackageforReduxwithReactandBabelsupport","main":"index.js","repos

javascript - 在 Swiper JS 中放大鼠标悬停

是否可以在用户将鼠标悬停在幻灯片上而不是双击时实现缩放功能?双击方法非常适合触摸,但对于桌面来说就不那么直观了,而且它会破坏其他交互元素(例如链接等)通过鼠标悬停进行缩放应该允许用户相对于鼠标到幻灯片中心的位置在缩放的幻灯片图像周围导航。将鼠标移动到右上角会将幻灯片图像平移并缩放到右上角区域,这与将鼠标移动到缩放容器内的任何其他Angular落或区域相同。如果有一个开关也可以在缩放时启用反向平移,那也很方便(例如,将光标移动到左上角会平移和缩放到图像的右下角)。 最佳答案 您可以在鼠标悬停事件上调用以下方法。mySwiper.zoo

javascript - 使用 babel.js 而不是 browserify 编译成 bundle

我从babel.js开始使用JavaScriptES6功能,但是我遇到了一个问题我目前正在使用browserify构建我的应用程序,并使用以下命令进行react。browserify-treactifyapp/main.js-opublic/scripts/bundle.js现在我想在babel中使用等效命令来捆绑我需要的模块,用ES6编写到bundle.js。这不起作用,只是给我一个ES5版本的main.js文件。babelapp/main.js-opublic/scripts/bundle.js但是我可以使用babel将我的bundle.js文件编译成ES6版本,有2个命令brow

javascript - 来自 UglifyJs 的 bundle.js 中的错误

我已经完成了一个项目,现在是构建它的时候了。我正在使用一个样板项目,但仍然不完全理解幕后发生的所有npm/webpack事情。运行“npmstart”时,我收到错误:ERRORinbundle.jsfromUglifyJsSyntaxError:Unexpectedtoken:punc())[bundle.js:848,29]在网上搜索这个问题一个小时后,我仍然无法解决它。据我了解,这个问题的发生是因为Uglify还不喜欢ES2016。但是,我在Internet上找到的解决方案似乎不起作用,或者对我来说实现起来意义不大。我找到了这个stackoverflowquestion并将我项目的

javascript - Webpack - 为什么我的 bundle.js 文件默认缩小了?

我正在学习React,我正在学习的在线类(class)使用的是webpack。我没有在我的webpack.config中添加任何缩小或丑陋的选项,但我的bundle.js仍然被缩小了。我不确定为什么或如何将其关闭。我附上了我的webpack.config.js和package.json。谢谢你的帮助。constpath=require('path');module.exports={entry:'./src/app.js',output:{path:path.join(__dirname,'public'),filename:'bundle.js'},module:{rules:[{l

javascript - 将 typescript 与 RollUp bundle 在一起 - 无法处理编译器选项

我正在尝试bundle我的typescript文件RollUp(https://rollupjs.org/)我使用了这个配置文件:rollup.config.js:importaliasfrom'rollup-plugin-alias';importresolvefrom'rollup-plugin-node-resolve';importtypescriptfrom'rollup-plugin-typescript';importangularfrom'rollup-plugin-angular';exportdefault{entry:'../main.ts',format:'ii

javascript - 如何检测swiper js中的当前幻灯片?

使用swiperjs作为slider并想要检测当前图像/幻灯片。我如何使用HTML和JS进行检测?有什么想法吗? 最佳答案 这很容易。只需使用这个:swiper.activeIndex 关于javascript-如何检测swiperjs中的当前幻灯片?,我们在StackOverflow上找到一个类似的问题: https://stackoverflow.com/questions/32945099/

javascript - 合并 JS 流时保留 sourcemaps(用 browserify bundle 连接 lib 依赖)

在我当前的工作流程中,我需要创建browserify包,但也希望将非commonjsjs库连接到文件的开头以公开全局变量,同时减少http请求的数量和js文件的大小。(其他包可能也需要其中一些库)我目前有一个gulp任务,它创建browserify包并将任何需要的库连接到输出文件的开头,但是我发现在合并流时,我的源映射正在中断,并且在网络检查器中;生成的map只显示预丑化的browserify包,而不是单独的js模块。vargulp=require("gulp"),buffer=require('vinyl-buffer'),gulpif=require("gulp-if"),sour