WebApp的前端所遇问题
2015年10月1日至10月25日,两个本科生和一位研究生以及一位老师组成四人团队,开发某教育前端项目
所遇问题总结以及分享:
一、主要应用软件:sublime_text HBuilder
初学者可以在JQuery mobile的Demo中寻找代码(可以看图找代码仿写)
1.回退按钮设置: <a href="javascript:history.back(-1);" style="background:none;box-shadow:none;border:none;" data-ajax="false"><img src="img/arrow.png" id="img_arrow"></a>
效果图:
加上style的属性即可,去掉加载图片的背景颜色,前提是PS时将图片设置成透明背景
遇到分隔线的情况:

可以类似,使用两个div去分隔开,比使用margin-top或直接加入图片的方法更为简单
<div class="ui-grid-c" >
<div class="ui-block-a"><span></span>
<br><span >超越全校学生</span></div>
<div class="ui-block-b"><span></span>
<br><span >超越全市学生</span></div>
<div class="ui-block-c"><span ></span>
<br><span></span></div>
<div class="ui-block-d"><span> </span>
<br><span></span></div>
</div>
2.文字缩放问题:</html>之后加上
加上jQuery.fontFlex.js文件
头部加上:
<script src="js/jQuery.fontFlex.js"></script>
</html>之后加上 :
<script type="text/javascript">
$(function() {
// All elements
$('body').fontFlex(10, 18, 30);
$('#img_arrow').fontFlex(10 , 30, 70);
// H1 only
$('h1').fontFlex(15, 40, 60); });
</script>
加上javascript的脚本即可解决文字随浏览器大小自动改变
3.ExamCompare中绘图多次渲染解决方案
网址:
http://www.4byte.cn/question/455962/android-webview-html5-canvas-error.html
4.页面跳转问题加上data-ajax="false"
<a href="javascript:history.back(-1);" style="background:none;box-shadow:none;border:none;" data-ajax="false">
网址:
http://zhidao.baidu.com/link?url=GgSKh384-vVFvUDrL3UlPiL7OmVdLo5rOAQBwiyzabn4WhtogYFoNRHTMbrdcak_qFO6izpYADo5D9_DalxWP7RHy5Qr2Uqbf5mnaB7Lujy
页面跳转时应该加上data-ajax="false",否则计算机上浏览器可以完美返回,到手机端着无法实现返回功能
5.alert在手机中改为无法被识别必须改为confirmJQM
JS文件夹中加入JQuery.Alert.js文件
<head>中加上:
<script src="js/JQuery.Alert.js"></script>
附件为用jquery写的提示框代码,请将此JS文件放入到js文件夹,并在head部分声明引用。
其后即可将每个javascript中出现的alert 替换为confirmJQM即可。
alert只能在计算机中实现,到在手机端中必须将alert改为confirmJQM
WebApp的前端所遇问题的更多相关文章
- webapp项目前端总结
提纲 整体把握,从设计稿入手——技术选型 并行开发,从实现静态页面开始 前端自动化 前端js逻辑 前后端集成 小问题集合 总结 1.整体把握,从设计稿入手 —— 技术选型 新项目到手,算是运气好,设计 ...
- 前端--再遇jQuery
一.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回第一个属性) attr(属性名|属性值) --一个参数是获取属性的值,两个参数是设置属性值 --点击图片加载示例 removeAttr(属 ...
- WebAPP移动前端性能优化规范和设计指导
- 【大前端之前后分离01】JS前端渲染VS服务器端渲染
前言 之前看了一篇文章:@Charlie.Zheng Web系统开发构架再思考-前后端的完全分离,文中论述了为何要前后分离,站在前端的角度来看,是很有必要的:但是如何说服团队使用前端渲染方案却是一个现 ...
- 安卓app开发方式之webApp
1.phonegap: 专注于webapp调用native的功能.2.ionic: 专注于webapp的前端ui技术,需要与phonegap(准确的说是和Cordova配合使用).ionic是一个专注 ...
- 使用express, create-react-app, mongodb搭建react模拟数据开发环境
提要 最近刚刚完成了一个vue的项目,其中涉及的用户数有6000多个以及其他数据也比较多,为了在前端能够真实的进行数据模拟,所有把全量数据拷贝下来放到了api.json中.这样导致整个api.json ...
- Java钉钉开发_02_免登授权(身份验证)(附源码)
源码已上传GitHub: https://github.com/shirayner/DingTalk_Demo 一.本节要点 1.免登授权的流程 (1)签名校验 (2)获取code,并传到后台 (3) ...
- 大型NodeJS项目架构与优化
使用场景: proxy(API冗余,跨域) vue ssr(服务端渲染) socket(大并发,通讯) 区块链(创业公司,新兴行业) 讨论什么? NodeJS异步IO原理及优化方案 NodeJS内存管 ...
- Spring+Hibernate+struts2+JPA 注解+跨域//完成手机端点击加载更多 下拉加载更多
一.使用IDEA新建一个maven项目(student) 1.1.0编写pom文件,添加项目所需要的包 <?xml version="1.0" encoding=" ...
随机推荐
- windows查看占用端口的进程
1方法 先找到进程号: netstat -aon|findstr 再根据进程号得到进程: tasklist |findstr " 2结果
- 隔离click事件
有一些应用,不需要我们自己的定义的click函数,例如: $(document).on('click', '#inp', function(e){ alert('hello world!'); }); ...
- 处理ecshp图片上传失真
默认生成jpg缩略图或商品图的质量是80,有些时候不够满意,现提供调整生成jpg图片的质量的方法找到includes/cls_image.php,在大约250行左右 /* 生成文件 */ ...
- [Unity] 2D开发学习教程
豆子先生,据说是官方的一个Demo, 在蛮牛网上有大部分代码的视频讲解. 这个是我学习过程中边看教程边写出来的,功能和原版基本一样,增加了手游的操控. Blog: http://www.cnblogs ...
- [转] Memcached参数设置 命令
只是看到了..这些命令肯定是没问题的.. 笔者现在也还不会用..汗..先留着..找到怎么用了在回来修改.. memcached的基本设置: -p 监听的端口-l 连接的IP地址, 默认是本机-d st ...
- python快排算法
通过一趟排序将要排序的数据分割成独立的两部分,其中一部分的所有数据都比另外一部分的所有数据都要小,然后再按此方法对这两部分数据分别进行快速排序,整个排序过程可以递归进行,以此达到整个数据变成有序序列. ...
- 浅谈JavaScript中的定时器
引言 使用setTimeout()和setInterval()创建的定时器可以实现很多有意思的功能.很多人认为定时器是一个单独的线程(之前我也是),但是JavaScript是运行在单线程环境中的,而定 ...
- redis缓存分页数据ID
1.用户通过分类.属性进来分页时 如果没有缓存,就读数据库前10页的数据Id,转为json,根据cate_分类1+cate_分类2+cate_分类3+arr_属性1+arr_属性2+arr_属性3作为 ...
- C# 获取指定接口的所有实现类
var types = AppDomain.CurrentDomain.GetAssemblies() .SelectMany(a => a.GetTypes().Where(t => t ...
- 30 分钟开发一个简单的 watchOS 2 app <oneVcat>
Apple Watch 和 watchOS 第一代产品只允许用户在 iPhone 设备上进行计算,然后将结果传输到手表上进行显示.在这个框架下,手表充当的功能在很大程度上只是手机的另一块小一些的显示器 ...