我前面介绍过 Mobile Detect 这个 PHP 类库,它可以用来检测移动设备环境,它有一个非常完整的库,可以检测出所用的设备类型(包括操作类型,以及手机品牌等都能检测)和浏览器的详细信息。...但是如果只是简单的判断下当前浏览博客的设备是否为移动设备,那么我们可以使用 WordPress 默认的函数 wp_is_mobile 函数来判断,但是这个函数有个问题,它把 iPad 也算作移动设备,但是...iPad 设备比较大,有时候我们仅仅希望在手机看到不同的设计和功能,所以我重新写了一个 wpjam_is_mobile 函数,去除了 iPad : function wpjam_is_mobile()...return true; } else { return false; } } 并且 wpjam_is_mobile 函数已经整合到 WPJAM Basic 插件中。
所有设备参数如下所示 ?
这篇文章收集了22款优秀的响应式 jQuery 幻灯片插件,它们能够帮助你在 Web 项目中实现有吸引力的图片滑块效果。 1....Master Slider Master Slider 是一个很棒的图层滑块,可以在图层添加任何 HTML 内容。容易使用,提供热点,缩略图,各种特效,视频支持。...Bx Slider bxSlider 是一个响应式的 jQuery 滑块,用来创建简单的内容滑块和滚动字幕。各种设置进行自定义显示器更容易。 8....Flex Slider FlexSlider 是一款轻量的响应式 jQuery 内容滚动插件,能够帮助你在项目轻松的创建漂亮的内容滚动效果。...Excolo Slider 一个简单的 jQuery 滑动插件,支持响应式设计和触屏设备。 20.
我们在进行EasyCVR视频移动端进行播放测试时,iOS系统和Android系统都能够较好适应视频的播放,但是仍收到部分用户反馈称在苹果设备中无法播放的问题。 排查发现在PC浏览器中可以正常播放。...查看配置发现这边默认的配置是FLV格式,FLV目前不支持在苹果设备中播放。这就是该项目中视频无法播放的原因,此处我们将iOS中默认的播放协议更改即可。 1.默认配置HLS协议。...2.在项目中找到播放组件加入如下过滤条件,当检测到为苹果设备强制播放HLS。...TSINGSEE青犀视频团队在流媒体行业丰富的开发经验,使得EasyCVR的整个开发过程非常流畅,并且平台功能仍在持续拓展中。
jQuery Mobile JavaScript 库是一种强大的方式,允许用户通过 Web 浏览器直接连接到触摸友好的应用程序,从而让移动和平板设备可以访问移动应用程序。...Cancel 不幸的是,在不支持 JavaScript 的设备上无法使用该选项。...在 jQuery Mobile 中,页眉的默认用法是作为固定在 Web 页面顶部的页面标题;在大部分情况下,页脚是 Web 页面中的最后一个元素,并且包括版权信息、其他超链接等内容。...用户在移动,并且简单、漂亮的格式化内容比以往任何时候都更加重要。 在为移动 Web 页面格式化内容时,重要的是要记住,大多数移动设备的屏幕都较窄。也就是说,仍然存在大量要调用列网格的情况。...除了所支持的 HTML5 输入类型之外,您还可以创建一个滑块。滑块包括一个图柄和一个供图柄在上面滑动的槽 。随着图柄的移动,滑块的值被存储起来,然后,在表单被提交时,该值也被提交。
之后我大胆推测了一下: 会不会是因为在移动端click事件的触发条件就是必须touchstart和touchend同时触发才能触发click呢?...原来touchmove中添加event.preventDefault方法之后会阻止浏览器默认的滚动。。。...所以页面无法滚动了,之后又去找找找,找了很久一直没找到怎么解决这个问题,突然想起之后用的一个移动端的图片轮播插件, 为什么他们可以左右滑动,不影响click事件和a标签,也不影响页面的滚动。...y*-1:y; //y轴的滑动值 if(w>h){ //如果是在x轴中滑动 event.preventDefault(); } 就是在touchmove中判断...x轴和y轴的移动值,判断当前是往哪个方向滑动,如果是在x轴上滑动(左右),就调用event.preventDefault()方法,如果是在y轴上滑动(上下),就不调用event.preventDefault
CSS3的新特性已经讲完了,接下来我们看一下jQuery的一个全屏jQuery全屏滚动插件fullPage.js。...,如果设置了options中css3: false*,如果你用除了jQuery的默认linear 和swing缓动的效果之外的缓动效果的话,需要添加 jQuery UI library。...布尔值 false 滚动到最底部后是否滚回顶部 loopTop 布尔值 false 滚动到最顶部后是否滚底部 loopHorizontal 布尔值 true 左右滑块是否循环滑动 autoScrolling...afterRender 页面结构生成后的回调函数,或者说页面初始化完成后的回调函数 afterSlideLoad 滚动到某一水平滑块后的回调函数,与 afterLoad 类似,接收 anchorLink...动画样式类可以提前记录在一个数组中或者是放到动画元素的自定义属性中。
Sliders滑块 Swiper -移动触摸滑块和框架与硬件加速转换。 slick - 你将需要的最后一个旋转木马。...unslider - 最简单的jQuery滑块有。 sly -用于单向滚动的JavaScript库,具有基于项目的导航支持。.... - http://leaverou.github.io/awesomplete/ Calendar日历 pickadate.js - 适合移动设备的响应速度很轻巧的jQuery日期和时间输入选择器。...没有jQuery。 parallax -视觉引擎对智能设备的方向做出反应。 stellar.js - 视差滚动变得容易。 plax -jQuery动力视差。...Dragula -拖放如此简单 Maps地图 Leaflet -适用于移动设备的交互式地图的JavaScript库。
如果你要制作一个全屏的网页,使用这个插件在合适不过,如QQ浏览器官方网站 直接下载 使用方法 1.引入fullpage.css文件 3.初始化...(true/false)滚动到最底部后是否滚回顶部 loopTop (true/false)滚动到最顶部后是否滚底部 loopHorizontal (true/false)左右滑块是否循环滑动 autoScrolling...afterRender 页面结构生成后的回调函数,或者说页面初始化完成后的回调函数 afterSlideLoad 滚动到某一水平滑块后的回调函数,与 afterLoad 类似,接收 anchorLink...、index、slideIndex、direction 4个参数 onSlideLeave 某一水平滑块滚动前的回调函数,与 onLeave 类似,接收 anchorLink、index、slideIndex
滑块 Swiper - 移动触摸滑块和框架,带有硬件加速转换。 slick - 您需要的最后一个旋转木马。...unslider - 最简单的jQuery滑块。 sly - 用于单向滚动的JavaScript库,具有基于项目的导航支持。 vegas - 一个jQuery插件,可以为您的网页添加漂亮的全屏背景。...iscroll - iScroll是一款高性能,占用空间小,无依赖,多平台的JavaScript滚动条。 skrollr - 适用于移动设备(Android + iOS)和桌面的独立视差滚动库。...没有jQuery。 parallax - 对智能设备方向作出反应的视差引擎。 stellar.js - 视差滚动变得容易。 plax - jQuery powered parallaxing。...floatThead - (jQuery插件)在正文中滚动时锁定任何表的标题。适用于任何表,不需要自定义html或CSS。 Masonry - 级联网格布局库。
官网 aurelia:一个适用于移动设备、桌面电脑和 web 的客户端 JavaScript 框架。...官网 jquery-validation:jQuery 验证插件。官网 validator.js:字符串验证和过滤(在使用用户输入之前清理用户输入中的有害或危险字符的操作)。...官网 幻灯片 Swiper:使用硬件加速过渡的移动设备触控滑块框架。官网 slick:你所需要的最后一个轮播插件。...官网 日历 pickadate.js:对移动设备友好的、响应式的和轻量的 jQuery 日期 & 时间输入选择器。...官网 skrollr:独立(不依赖 jQuery) 的视差滚动库,适用于移动设备(Android + iOS)和桌面电脑。官网 parallax:面向智能设备的视差引擎。
Swiper.js Swiper 是免费的现代移动触摸滑块控件,具有硬件加速过渡和惊人的原生行为。 官网:https://swiperjs.com/ ?...Glide 无依赖的 JavaScript ES6 滑块和轮播。它轻巧、灵活、快速。 官网:https://glidejs.com/ ? Glide 5....AOS 滚动动画(AOS)。可在滚动时为页面上的元素设置动画的小型库。 官网:https://michalsnik.github.io/aos/ ?...AOS 7. jump.js Jump.js 是使用纯 JavaScript(ES6)编写的现代、高性能且可自定义的平滑滚动库。...与 Select2 和 Selectize 类似,但没有 jQuery 依赖关系。 官网:https://joshuajohnson.co.uk/Choices/ ? Choices.js
这个Jquery 插件值得推荐——虽然我不清楚在什么情况下适用,但你知道有这个东西,在需要的时候就能用上了——收集多点资源总不是坏事。插件的效果具体我也不会说,直接看官网demo吧。...简介 官方网站& demo:http://zurb.com/playground/twentytwenty 运行必备:jquery、jquery.event.move(一个用于在移动设备上支持触摸事件的类...) 浏览器兼容:IE9 + ,其他现代浏览器 TwentyTwenty的工作原理是在彼此的顶部堆叠的两个图像。...当滑块在整个图像移动,它使CSS的使用剪辑属性来裁剪图像左侧,这允许在右侧的图像通过容器来显示。 我们正在使用的自定义运动事件jquery.event.move库,以支持在移动设备上1:1滑块运动。...twentytwenty()这个容器加载图像: $(window).load(function() { $("#container1").twentytwenty(); }); WordPress 插件 这里有个在TwentyTwenty
一 关于Swiper swiper是一款轻量级以及免费的移动设备触控滑块的js框架,主要运用于移动端的操作,但也可以用于pc端页面效果制作,完全的开源免费, 二 学习Swiper Swiper官网提供了学习方法以及... swiper.min.js swiper.min.css ),新建文件夹js和css,将js文件放在js中,将css文件放在css中,同时去京东官网获取轮播图片,放在image文件夹下 ...--如果需要滚动条 --> <!...{ width:590px; height: 470px; } 4.初始化Swiper:最好是挨着标签(如果没有紧挨着可以在函数前加...--如果需要滚动条 --> <!
开发技术:HTML 5, CSS 3, JS, jQuery 网站特色: l 滑块 l 响应式视网膜菜单 l 幽灵按钮 l SEO友好 l 设备响应 l jQuery&Javascript插件 l YouTube...兼容所有设备,显示在所有屏幕尺寸上。它完全建立在Bootstrap框架中,HTML5,CSS3和JQuery.你可以轻松的将这个模板与任何其他类型的生意相结合。 4. ...主页上有一个带有标题文字的猫头鹰旋转木马滑块。此外,有jQuery UI日历的旅行预订表格。在主页有旅游套餐,最热门的目的地和关于您的公司的部分,让网站访问者和专业外观的网站印象深刻。 5. ...开发技术:Bootstrap framework, HTML5, CSS3, JQuery 网页特色: l 100%响应Bootstrap滑块 l 基于Font Awesome的图标 l HTML5和CSS3...艺术作品和创意项目在模板正面和中心位置展示,非常吸引人。引人注目的黑白媒体以及视差滚动为丰富多彩的独特风格提供了完美的背景。
表单控件只能在工作表中通过设置控件格式或者指定宏来使用,而ActiveX控件则有属性和事件,可以在工作表中和用户窗体中使用。 可以在开发工具选项卡的插入功能中,可以看到两种控件。...在Excel工作表中主要使用表单控件,它不仅与早期Excel版本更兼容,而且使用相对更简单,下面将分两节介绍常用的表单控件。...下面通过简单示例来演示下如何使用,首先以几个水果的价格为例,已经设置了函数公式价格=单价*数量,并计算总计。 插入数值调节钮控件,选择设置控件格式--控制选项。...而页步长是移动中间滑块时数值的变化大小。 示例以步长为1,页步长为10,可以在示例中看到点击两端箭头时,数值以1为单位变化。而移动滑块时,数值是以10为单位变化。...对于不习惯上下或者有需要将滚动条横向放置,只需要右键选择滚动条。之后调整大小。调整成扁平状后,Excel会自动滚动条设置为横向的。这样方便放置在每个类型的单元格后。
此外,Bootstrap具有一些创新功能,如移动友好型,SAAS,干净轻便的代码,跨浏览器兼容性等等,使得大多数设计人员使用此框架可以用较少的时间和精力创建响应式网站。...AweSplash - 免费的HTML闪屏页面 开发技术:HTML 5, CSS 3, JS, jQuery 网站特色: l 滑块 l 响应式视网膜菜单 l 幽灵按钮 l SEO友好 l 设备响应 l...兼容所有设备,显示在所有屏幕尺寸上。它完全建立在Bootstrap框架中,HTML5,CSS3和JQuery.你可以轻松的将这个模板与任何其他类型的生意相结合。 4. ...主页上有一个带有标题文字的猫头鹰旋转木马滑块。此外,有jQuery UI日历的旅行预订表格。在主页有旅游套餐,最热门的目的地和关于您的公司的部分,让网站访问者和专业外观的网站印象深刻。 5. ...艺术作品和创意项目在模板正面和中心位置展示,非常吸引人。引人注目的黑白媒体以及视差滚动为丰富多彩的独特风格提供了完美的背景。
先区分一下 window 对象和 document 对象: window 对象表示浏览器中打开的窗口,而 document 对象表示整个 html 文档,它是 window 对象的一部分。...element.scrollTop/element.scrollLeft: 返回元素在垂直方向或者水平方向上已滚动的距离。...如下图: image.png 可以看出,假如元素在页面滚动条的拖动下向上移动,则元素的 top 会是负值。...image.png jQuery width()/height(): 无参时返回元素的 content 的宽度/高度,传参时(数字或者函数)设置元素的 content 的宽度/高度。...scrollLeft()/scrollTop(): 水平方向上或者垂直方向上,滑块相对于整个滚动条的位置。对于某个元素,滑块处于初始位置或者无滚动条时,该方法返回 0。
领取专属 10元无门槛券
手把手带您无忧上云