The page is temporarily unavailable
nginx error!
The page you are looking for is temporarily unavailable.
Please try again later.
Website Administrator
Something has triggered an error on your
This is the default error page for
nginx that is distributed with
It is located
/usr/share/nginx/html/50x.html
You should customize this error page for your own
site or edit the error_page directive in
the nginx configuration file
/etc/nginx/nginx.conf.长页面怎样翻页
&&& 11:31:56
做了两页，一页长页面，一页常规页面。看完第一页翻不了去第二页
你设置的是左右翻页，还是上下翻页呢？
问题已解决，该模板使用了禁止滑动翻页功能。
你设置的是左右翻页，还是上下翻页呢？
问题已解决，该模板使用了禁止滑动翻页功能。
请问如何解除这个静止滑动翻页功能？是不是模板禁止的就不能解除了。我现在想实现一页常规单页翻到另一页长页的。谢谢解答！
该模板使用了禁止滑动翻页功能
禁止滑动是怎么用的？
禁止滑动翻页是会员特权哈，
禁止滑动是怎么用的？
这是会员功能，如果需要了解会员功能，或者升级会员，可以联系我进行咨询。
发表于 6&天前
做了两页，一页长页面，一页常规页面。看完第一页翻不了去第二页http://www.dongfangnk.net
http://wap.dongfangnk.net
<font color=#积分
<font color=#金币
<font color=#帖子
公告1234567最新帖子12345678910最新精华12345678910
微信：扫描二维码咨询在线客服
电话：010-
时间：9:00-18:00The page is temporarily unavailable
nginx error!
The page you are looking for is temporarily unavailable.
Please try again later.
Website Administrator
Something has triggered an error on your
This is the default error page for
nginx that is distributed with
It is located
/usr/share/nginx/html/50x.html
You should customize this error page for your own
site or edit the error_page directive in
the nginx configuration file
/etc/nginx/nginx.conf.使用jQueryMobile实现滑动翻页效果的方法
作者：yongh701
字体：[ ] 类型：转载 时间：
这篇文章主要介绍了使用jQueryMobile实现滑动翻页效果的方法,较为详细的分析了jQueryMobile实现滑动翻页效果的原理与实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了使用jQueryMobile实现滑动翻页效果的方法。分享给大家供大家参考。具体分析如下：
滑动手势在移动设备是很流行的，在移动设备中滑动翻页中很常见
虽然这个功能可以在jQueryMobile中实现，但是个人与之前一篇【】中的观点一致，由于这是在手机浏览器中浏览，而不是安卓的一个独立APP，所以不要经常除点击以外的移动设备手势，以免跟手机浏览器与手机系统本身的手势发生冲突。
那么，使用jQueryMobile实现滑动翻页的效果到底怎么做呢？
一、基本目标
在手机浏览器中的jQueryMobile框架页中现实滑动手势翻页的功能，如下图：
并且记录当前页的页数，随用户滑动而自动增加与减少。
二、制作过程
关于JqueryMobile的界面怎么布置，不再细说，详情请翻阅之前一篇【】
如下的代码注释，主要是叙述如何通过对JqueryMobile封装好的滑动手势jQuery Mobile Swipeleft与jQuery Mobile Swiperight处理，来实现上面的页面，W3C《》一文中对此的叙述是有问题的，实验代码与给出的代码并不一致：
代码如下:&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&&
&html xmlns="http://www.w3.org/1999/xhtml"&&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&&
&title&a&/title&&
&meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"&&
&!-- 需要的文件不再多嘴 --&&
&link rel="stylesheet" href="jqmobile/jquery.mobile-1.4.5.css"&&
&script src="jqmobile/jquery-1.11.1.js"&&/script&&
&script src="jqmobile/jquery.mobile-1.4.5.js"&&/script&&
&!-- 必须此页命名，否则下面的jquerymobile滑动手势控制不到，不起作用 --&&
&div data-role="page" data-position="fixed" data-fullscreen="true" id="mypage"&&
& &div data-role="header" data-theme="b" data-tap-toggle = "false"&&
&&& &h1&Title&/h1&&
&!-- html部分很简单，就在content中布局4个图层，其中div1一开始显示，其余隐藏即好，之所以把“你好”二字设置得大大的，是由于jquerymobile的滑动必须滑到图层内的非空白部分，即使你设置了width:100%; height:100% --&&
& &div data-role="content"&&
&&&&& &div id="div1"&&
&&&&&&& &h1&你好1&/h1&&
&&&&& &/div&&
&&&&& &div id="div2" style="display:"&&
&&&&&&& &h1&你好2&/h1&&
&&&&& &/div&&
&&&&& &div id="div3" style="display:"&&
&&&&&&& &h1&你好3&/h1&&
&&&&& &/div&&
&&&&& &div id="div4" style="display:"&&
&&&&&&& &h1&你好4&/h1&&
&&&&& &/div&&
&&&&& &!-- 此乃记录翻到那一页的图层，有一个名叫divnumber的行内文本 --&&
&&&&& &div&&
&&&&&&& &span id="divnumber"&&/span&&span&/4&/span&&
&&&&& &/div&&
& &div data-role="footer" data-position="fixed" data-fullscreen="true"& data-theme="b" data-tap-toggle = "false"&&
&&&&& &div data-role="navbar"&&
&&&&& &ul&&
&&&&&&& &li&&a href="#" class="ui-btn-active ui-state-persist" data-icon="info"&a&/a&&/li&&
&&&&&&& &li&&a href="#" target="_self" data-icon="grid"&b&/a&&/li&&
&&&&&&& &li&&a href="#" target="_self" data-icon="star"&c&/a&&/li&&
&&&&& &/ul&&
&&& &/div&&
& &/div&&&
&&& /* jquery部分，先定义一个记录翻到多少页的变量 */&
&&& var divnum=1;&
&&& /* 相当于.innerhtml=""; jquery设置一个节点的值是需要这样设定的 */&
&&& $("#divnumber").text(divnum)&
&&& /* 在#mypage页面开启触控 */&
&&& $(document).on("pageinit","#mypage",function(){&
&&&&&&& /* 如果对div1的非空白部分向左滑，那么div1就隐藏，div2就显示，同时页面计数器+1，并更新divnumber这个行内文本 */&
&&&&&&& $("#div1").on("swipeleft",function(){&
&&&&&&&&&&&& $("#div1").hide("fast");&
&&&&&&&&&&&& $("#div2").show("fast");&
&&&&&&&&&&&& divnum=divnum+1;&
&&&&&&&&&&&& $("#divnumber").text(divnum)&
&&&&&&& });&
&&&&&&& /* 如果对div2的非空白部分向右滑，那么div1就显示，div2就隐藏，同时页面计数器-1，并更新divnumber这个行内文本 */&
&&&&&&&& $("#div2").on("swiperight",function(){&
&&&&&&&&&&&& $("#div1").show("fast");&
&&&&&&&&&&&& $("#div2").hide("fast");&
&&&&&&&&&&&& divnum=divnum-1;&
&&&&&&&&&&&& $("#divnumber").text(divnum)&
&&&&&&& });&
&&&&&&& /* 如果对div2的非空白部分向左滑，那么div2就隐藏，div3就显示，同时页面计数器+1，并更新divnumber这个行内文本，下面如此类推 */&
&&&&&&& $("#div2").on("swipeleft",function(){&
&&&&&&&&&&&& $("#div2").hide("fast");&
&&&&&&&&&&&& $("#div3").show("fast");&
&&&&&&&&&&&& divnum=divnum+1;&
&&&&&&&&&&&& $("#divnumber").text(divnum)&
&&&&&&& });&
&&&&&&& $("#div3").on("swiperight",function(){&
&&&&&&&&&&&& $("#div2").show("fast");&
&&&&&&&&&&&& $("#div3").hide("fast");&
&&&&&&&&&&&& divnum=divnum-1;&
&&&&&&&&&&&& $("#divnumber").text(divnum)&
&&&&&&& });&
&&&&&&& $("#div3").on("swipeleft",function(){&
&&&&&&&&&&&& $("#div3").hide("fast");&
&&&&&&&&&&&& $("#div4").show("fast");&
&&&&&&&&&&&& divnum=divnum+1;&
&&&&&&&&&&&& $("#divnumber").text(divnum)&
&&&&&&& });&
&&&&&&&& $("#div4").on("swiperight",function(){&
&&&&&&&&&&&& $("#div3").show("fast");&
&&&&&&&&&&&& $("#div4").hide("fast");&
&&&&&&&&&&&& divnum=divnum-1;&
&&&&&&&&&&&& $("#divnumber").text(divnum)&
&&&&&&& });&&&&&&&&&&&&&&&&&&&&&&&&&&&
请注意，div1没有向右滑的手势，因为这是第一页，div4没有向左滑的手势，因为这是最后一页。
希望本文所述对大家的jQueryMobile程序设计有所帮助。
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具如果你这样制作易企秀H5，你就大错特错了
易企秀H5已经火了好一段时间了,也算是狠狠地风光了一把,但还是有人在问:“什么是H5,怎么制作H5, 我还只是个新手。”我看过很多H5场景,其实还是有很多小伙伴制作的H5真不错,我也经常跟大家分享。今天我不谈好的场景该怎么制作,而是告诉大家有些明显的错误不要再犯错了。
错误1：没有明确主题
有些H5展示页面特别多，翻来翻去就是到不了最后一页，而且在耗费大家时间的同时，还没让人明白这个H5到底想表达什么。
还有一些H5，展示了特别多的图片，终究都没表达出展示图片的主题是什么？
如：这个H5，共23页，前面铺垫太长，还没等主题出来，很多人就放弃浏览了。其实，整个H5节凑、画面都还不错，可惜没有尽快表达主题，失去了让别人接触主题的机会。
错误2：没有统一风格
一个H5，一个风格。这是制作场景的基本规律。一般在制作H5时通常会犯错的有2种情况：第1种情况是一页一个风格，第1页中国风、第2页萌萌哒、第3页炫酷风、第4页扁平化风格了……这种H5总会让人很崩溃，观看者需要带着不断变化的心态去看，整体给人的感觉就是不伦不类。制作H5，真的不是风格越多越好。第2种情况是：整个H5风格统一了，为了加上自己的宣传页，把整个H5格调都降低了，要么因为风格不合适就不要放，要么就再设计一个符合H5风格的宣传页，别偷懒了。
上图为DQ用H5制作工具易企秀制作的招聘启事，供参考
错误3：图片模糊一个H5，它的视觉效果要比文字效果重要的多。观看者多数是看看画面，扫一遍文字，就过了。虽然图片很重要，但是很多小伙伴在制作场景的时候，图片制作的真的很不用心。可能是为了加载速度加快，需要像素较小的图片，但是一定要谨记：保证视觉观看的舒适度！不能一味追求小像素的图片，破坏了整个H5的格局。
错误4：文字杂多、变形、模糊文字问题是很多H5会出现的，包括文字密密麻麻的布满整个页面、文字变形、文字模糊、文字遗漏，甚至错别字的出现。H5场景中，文字问题最容易出现，也容易解决，最重要的是制作者要细心。文字的使用，需要坚持以下原则：文字简洁；文字清晰；文字完整。
错误5：夸张的动画动画效果是一个H5场景的必备，恰当使用动画效果，能使得H5栩栩如生，增加互动性。能给阅读者带来浏览兴趣。但是切忌频繁使用动画，整个页面都是动画，文字、图片飞来飞去，那绝对会失去你的目标用户了。
不要使用频繁使用抖动的动画，视觉效果极差；不要多次使用指纹动画，其实指纹动画已经使用泛滥，只会有多此一举的效果；还有一些H5使用超级慢的动画，浏览者早就会被磨去了耐心而放弃阅读了。
错误6：杂乱的排版有精美的图片、简洁的文字，不一定就会制作出一个让人赞赏的H5，还得看制作者怎么把这些素材整洁有效的排版好。需要注意的是：1.动画和文字排版协调；2.文字和图片排版协调。其实H5页面可利用简单的点、线、框、不规则几何图形、错落有致的将图片、文字排版等都可达到干净整洁素雅效果。
错误7：不搭调的音乐大部分人制作的H5场景，在选择音乐方面都没有问题。选择一首好听的歌曲，能给你的场景起到意想不到的效果，类似于有画龙点睛的作用，配合一首音乐，你的场景就活了。在选择音乐时，需要注意：1.配合你的场景风格选择2.配合你的场景主题选择即可。当然，也有选择错误音乐的案例。
错误8：混乱的节奏文字、图片、音乐都备齐了，制作一个H5场景就差不多完成了，要想使你的H5场景浏览流畅感提升，需要准确的把握好页面之间的节奏、动画之间的节奏、逻辑方面的节奏。一个好的节奏，需要极其精确和巧妙的安排。同样，也有节奏不好的案例。
错误9：忘记检查
千万别忘记在制作完成一个H5后，从前到后的检查一遍。这可不像考试卷，检查了却把正确答案改错了。这个检查是指文字有没有遗漏，图片有没有变形等。这一步骤需要注意的就是细心检查了。别小瞧这一步的重要性，一个小小的细节可能毁掉你整个H5。
责任编辑：
声明：本文由入驻搜狐号的作者撰写，除搜狐官方账号外，观点仅代表作者本人，不代表搜狐立场。
今日搜狐热点