"开发路上踩过的坑要一个个填起来————持续更新······(7月30日)"
欢迎转载,请注明出处!
https://gii16.github.io/learnmore/2016/07/29/problem.html
踩过的坑及解决方案记录在此篇博文中!
个人理解,如有偏颇,欢迎指出!
欢迎交流!
3.scss和css的区别
在使用github pages的jekylltheme时,发现有一个scss文件,略感好奇。查了一下,scss文件是css预处理器所产生的中间文件,可通过编译产生css文件。简单说起来就是,程序员觉得CSS只能一行一行的手动添加实在是太麻烦。于是大家约定好,使用一种语言写一个文件,通过该文件可以编译出具体的css文件,比如你在JAVA当中使用for循环执行了10词println,你只需要两行代码就搞定了,但最终运行的时候会输出10行内容。这多出来的八行就不需要你手动去写。
2.移动端CSS3中的contenteditable属性引起的图片删除问题(待解决)
CSS3中提供属性contenteditable,可将DIV变为可编辑的,为自行开发富文本编辑器提供便利。笔者之前在使用一款移动端开源编辑器artEditor(https://github.com/baixuexiyang/artEditor)时,遇到部分安卓机型图片无法删除的问题,即光标在图片后面时,点击删除键,不会删除图片,光标会直接跳到图片前面并删除图片前面的文字。笔者对该问题进行了测试,发现不仅是该编辑器的问题,即使直接使用contenteditable=ture的DIV,使用appendchild(img)方式插入图片,图片也无法删除。
初步预测该问题与不同机型的安卓浏览器内核有关,可能部分厂家对内核进行了二次开发,导致该兼容性问题。该问题尚未解决。
1.CSS3中的transition属性引起的滑动问题
设想你在使用Html+Js+Css进行开发,需要实现一个根据点击位置弹出菜单的功能,之前在移动端的开发中笔者遇到过这个需求,即在手指点击的位置弹出一个菜单。笔者的做法是对菜单DIV设置style="display:none",通过class设置position为fixed,在点击后,获取鼠标位置,对菜单DIV设置style="top:(具体值);left:(具体值);"(当然也可以使用JQuery实现)。
但在具体操作时,发现弹出菜单并不是直接出现在鼠标点击的位置,而是先出现在它原来的位置,然后滑行到鼠标点击的位置,这个方式会暴露菜单前一次所在的位置,用户体验不好。
查阅相关资料后发现是CSS3中新属性transition的设置问题。该属性用于产生一个过渡效果,详情可见W3C:http://www.w3school.com.cn/cssref/pr_transition.asp。想要关闭过渡效果只需要设置transition:none;或者transition-property:none;即可,这里要注意不同浏览器兼容性。
设置后,菜单直接出现,没有滑动效果。
"开发路上踩过的坑要一个个填起来————持续更新······(7月30日)"的更多相关文章
- Dcloud开发webApp踩过的坑
Dcloud开发webApp踩过的坑 一.总结 一句话总结:HTML5+扩展了JavaScript对象plus,使得js可以调用各种浏览器无法实现或实现不佳的系统能力,设备能力如摄像头.陀螺仪.文件系 ...
- 转:Flutter开发中踩过的坑
记录一下入手Flutter后实际开发中踩过的一些坑,这些坑希望后来者踩的越少越好.本文章默认读者已经掌握Flutter初步开发基础. 坑1问题:在debug模式下,App启动第一个页面会很慢,甚至是黑 ...
- vue项目开发中踩过的坑
一.路由 这两天移动端的同事在研究vue,跟我说看着我的项目做的,子路由访问的时候是空白的,我第一反应是,不会模块没加载进来吧,还是....此处省略一千字... 废话不多说上代码 路由代码 { pat ...
- 写一写关于python开发面试的常遇到的问题以及解答吧,持续更新——看心情
1,什么是python中的魔术方法? 魔术方法是重载运算符的昵称,形式是__init__类似这样的前后双下滑线组成的,常用的__init__,__new__,__call__,__str__,__ge ...
- vuejs 开发中踩到的坑
用 v-for 循环式 每个item的值相等的情况下,会影响v-model的双向绑定: Modal 组件开发,主要用slot 标签来实现 <template> <transitio ...
- 那些年,我们在Django web开发中踩过的坑(一)——神奇的‘/’与ajax+iframe上传
一.上传图片并在前端展示 为了避免前端整体刷新,我们采用ajax+iframe(兼容所有浏览器)上传,这样用户上传之后就可以立即看到图片: 上传前: 上传后: 前端部分html: <form s ...
- vue高频面试题(面试路上踩过的坑)
### Vue 双向绑定原理 mvvm 双向绑定,采用**数据劫持结合发布者-订阅者模式**的方式,通过 `Object.defineProperty()` 来劫持各个属性的 setter.gette ...
- iphone 开发h5 踩过的坑
html,body{ -webkit-text-size-adjust: none; } // 当需要在中文版chrome浏览器中显示小于12px的字体时,而且此时页面放大效果会被阻止 html,b ...
- asp.net开发中遇到的奇葩bug及解决办法(会持续更新。。。)
1,不知道你们遇没遇到过,在vs2010或更高版本上运行程序的时候,完全没问题,放在IIS中出现了问题,就比如左侧是菜单项,点击菜单右边显示,如果菜单链接是这样:content.aspx,而另一个链接 ...
随机推荐
- Servlet Filter 3
11.MD5加密 /** * 使用md5的算法进行加密 */ public static String md5(String plainText) { byte[] secretBytes = nul ...
- Maven仓库—Nexus环境搭建及简单介绍
1. 环境搭建 1.1 下载 http://www.sonatype.org/nexus/ NEXUS OSS [OSS = Open Source Software,开源软件--免费] NE ...
- Hadoop:使用原生python编写MapReduce
功能实现 功能:统计文本文件中所有单词出现的频率功能. 下面是要统计的文本文件 [/root/hadooptest/input.txt] foo foo quux labs foo bar quux ...
- Linux删除包含特殊符号文件名的文件
今天发现机器上有一文件名为 ~~test 的文件名,欲删除之 ,报错查了下, 发现如下解决方法 假设Linux系统中有一个文件名叫“-test”.如果用户想删除它,按照一般的删除方法在命令行中输入“r ...
- u-boot启动流程分析(2)_板级(board)部分
转自:http://www.wowotech.net/u-boot/boot_flow_2.html 目录: 1. 前言 2. Generic Board 3. _main 4. global dat ...
- 151. Reverse Words in a String
Given an input string, reverse the string word by word. For example,Given s = "the sky is blue& ...
- 最小费用最大流 POJ2195-Going Home
网络流相关知识参考: http://www.cnblogs.com/luweiseu/archive/2012/07/14/2591573.html 出处:優YoU http://blog.csdn. ...
- 尽量采用as操作符而不是旧式C风格做强制类型转换
http://www.cnblogs.com/JiangSoney/archive/2009/08/07/1541488.html MSDN: https://msdn.microsoft.com/z ...
- JavaScript权威指南 第七章 数组
主要介绍一下数组方法 1.Join() Array.join()方法将数组中所有元素都转换为字符串并连接在一起,返回最后生成的字符串. 可以指定一个可选的字符串在生成的字符串中来分隔数组的各个元素.默 ...
- 在Java中使用Memcached(转)
memcache的Java客户端调用,在网上还是有些少,很多都是php的.如何要想用Java调用memcache的服务,首先要有客户端的支持,我们先下载一个客户端吧.下载地址:https://gith ...