移动web开发相关笔记(三)

1.推荐以sublime插件的排名官网:https://packagecontrol.io/(sublime插件官网)


2.时间算法

//总秒数
var totalSecond= 3671;
//获取里面的小时
var hours=Math.floor(totalSecond/3600);
//获取剩下的分钟
var minute=Math.floor(totalSecond%3600/60);
//获取剩下的秒
var second=totalSecond%60;


//算法的原理是
小时:总秒数除以3600就是小时,但是不要小数,所以向下取整
分钟:总秒数余以3600,其实就获取除以3600后的余数,余数是71,之后用71/60,也就是除以1分钟的秒数,就获取到了分钟,还是不要小数,向下取整
秒:总秒数余以60,其实就是获取除以60后的余数,结果是11,这个地方有点不同常理,但是无论是3600还是60,其实都是一分钟60秒的倍数,不足一分钟就是秒了,也就是剩下的余数。



3.实际开发中页面中的数据的获取
◆动态网站(基本所有的网站都是动态的):页面中的内容是动态生成的,例如img的src属性,a标签的文本值,页面的布局效果等等。
◆不刷新页面获取新数据:【
◇使用ajax技术来发送请求
◇可以在以下情况下发送请求,如点击加载更多(点击事件发送请求)、滚动加载更多(滚动事件发送请求)、逝去焦点验证用户名(失去焦点事件中发送请求)。

◆使用ajax获取数据,通常情况下是由产品经理来设计的,设计页面的大体布局以及交互效果,它很容易与美工与程序起冲突。


4.移动的轮播图与pc端的有点不一样。
◆自动轮播【








◆手指拨动 轮播


5.推荐一个sublime中文官网:http://sublimetext.iaixue.com/(Sublime Text 中文官网)


6.css3过渡属性tansition的过渡结束事件(由于是css3中的新属性对应的新事件,所以需要加上各个浏览器的私有化前缀)
◆默认这么写:element.addEventListener('transitionEnd',function(){
});
◆加上私有化前缀这么写:element.addEventListener('webkitTransitionEnd',function(){
});,如果是火狐浏览器,将第一个参数改成mozTransition,IE则是msTransition,欧朋则是oTransition。
★这个事件专门针对被过渡的属性,所以当你设置transition的属性值为all的时候,可能这个事件会被触发多次。


7.移动端的手指触摸屏幕的事件(类似鼠标的事件),不支持简单绑定的方式,只可以使用addEventListener这种绑定方式,只有移动设备上支持
◆touchstart:手指触摸时触发(事件参数中有触摸点的值)
◆touchmove:手指在屏幕上滑动时连续触发(事件参数中有触摸点的值)
◆touchend:当手指离开屏幕时触发(事件参数中没有触摸点的值)
◆touchcancel:系统停止跟踪触摸时会触发,比如alert弹出一个框框,阻塞了线程,就会触发这个事件。(这个事件使用的很少)
◆通过事件参数 获取移动的一些属性
element.addEventListener('touchstart',function(event){
var event=event||window.event;
console.log(event.targetTouches);//目标元素的所有当前触摸
console.log(event.changedTouches);//最新更改的所有触摸
console.log(event.touches);//所有的触摸
});
★start、move、end这三个事件常见的封装:左滑、右滑、长按、捏合等等。


8.推荐一个在线编辑markdown的网站:https://www.zybuluo.com/mdeditor(在线 Cmd Markdown 编辑阅读器),https://maxiang.io/(马克飞象)

转载于:https://www.cnblogs.com/jwlLWJ2018/p/9247783.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/280106.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

互联网和IT行业越来越严峻,前景几何?

楔子新冠疫情反反复复,互联网和IT行业一路下滑。硅谷裁员高达10万人。前景该何处何从呢?春江水暖猪先知IT行业如此的不景气,自然是一些在风口上被吹起来的猪首先感受到了。他们进行的自救其实就一条:裁员,大量的裁员。裁员可以解决…

Asp.net MVC使用Model Binding解除Session, Cookie等依赖

上篇文章"Asp.net MVC使用Filter解除Session, Cookie等依赖"介绍了如何使用Filter来解除对于Session, Cookie的依赖。其实这个也可以通过Model Binding来达到同样的效果。 什么是Model Binding? Model Binding的作用就是将Request请求中包含的散乱参数,根…

C++回声服务器_4-UDP connect版本客户端

针对UDP套接字调用connect函数不会与对方UDP套接字建立连接,只是向UDP套接字注册目标IP和端口信息。 修改客户端代码 服务器代码不需要修改,只需修改客户端代码。调用connect函数之后,可以调用write函数和read函数来发送、接收数据&#xff0…

如何在路由绑定中使用 IParsable

IParsable 是 .Net 7 中新增的接口,它可以将字符串转换为对应的实体。在 Controller 的 Route 绑定中可以使用 IParsable 来绑定复杂的实体。实验背景 假设有一个需要将 route "report/{month}-{day}" 绑定到 MyDate 对象上的场景。在 .Net 7 之前&#x…

火狐 新增标签 一直加载_在Firefox的新标签页中加载最后标签页的URL

火狐 新增标签 一直加载Yeah, you’re pretty sure that you’re the master of all things Firefox. I mean, why else would you be reading this article? So, we’ve got to ask, have you ever seen this one before? 是的,您很确定自己是Firefox的所有人。 …

ptyhon【递归练习】

转载于:https://www.cnblogs.com/LTEF/p/9187287.html

Iterator 和 for...of 循环

本系列属于阮一峰老师所著的ECMAScript 6 入门学习笔记 Iterator(遍历器) JavaScript表示“集合”的数据结构,除了Array 、Object ,ES6又新增了Map 和Set 。 遍历器(Iterator)是一种统一的接口机制,用来处理所有不同的…

JAVA常量

2019独角兽企业重金招聘Python工程师标准>>> 常量就是一个固定值。它们不需要计算,直接代表相应的值。 常量指不能改变的量。 在Java中用final标志,声明方式和变量类似: final double PI 3.1415927; 虽然常量名也可以用小写&…

基于Docker托管Azure DevOps代理

Azure DevOps非常好用,但是为代理准备单独的服务器经常会显得性价比不高:配置低了,前端构建时会教会你做人,配置太高又有点浪费资源,代理数量少了各团队构建要打架。对于既想享受DevOps的美妙之处但是资源捉襟见肘的小…

微软 word转换pdf_如何将行转换为Microsoft Word表中的列

微软 word转换pdfYou’ve created a table in Word and started to enter your data. Then, you realize that the table should be transposed, meaning the rows should be columns and vice versa. Rather than recreating the table and manually entering the data again,…

pycharm中如何正确配置pyqt5

网上看了几个文章,不成功。这样做才是正确姿势: /Users/mac/anaconda3/bin/Designer.app /Users/mac/anaconda3/bin$ProjectFileDir$ pyuic5 $FileName$ -o $FileNameWithoutExtension$.py $ProjectFileDir$ 其它细节懒得说。 转载于:https://www.cnblog…

JS常用的设计模式

持续更新JS常用的设计模式以及应用场景*以下内容为个人简单理解以及摘抄部分网上demo组成,有错误请在下方评论指出?*# 何谓设计模式没必要被高大上的名词所吓倒,日常coding中或许一个不了解各种设计模式的程序员可能自己其实已经用到了很多抛开官方的定…

如何在Photoshop中制作双曝光图像

Double exposure images are popular at the moment. Taylor Swift’s Style music video and the True Detective opening theme both used the effect. It’s a technique where two separate photos—typically a portrait and a landscape—are blended together into one …

记一次.NET 某安全生产系统 CPU爆高分析

一:背景 1.讲故事今天是🐏的第四天,头终于不巨疼了,写文章已经没什么问题,赶紧爬起来写。这个月初有位朋友找到我,说他的程序出现了CPU爆高,让我帮忙看下怎么回事,简单分析了下有两点…

JDBC 学习笔记(一)—— JDBC 基础

1. 什么是 JDBC JDBC,Java Database Connectivity(Java 数据库连接),是一组执行 SQL 语句的 Java API。 JDBC,是 Java SE(Java Platform, Standard Edition)标准的一部分。 Java 程序可以通过 J…

JavaScript享元模式

JavaScript享元模式 通过两个例子的对比来凸显享元模式的特点:享元模式是一个为了提高性能(空间复杂度)的设计模式,享元模式可以避免大量非常相似类的开销。 第一实例,没有使用享元模式,计算所花费的时间和空间使用程度。 要求为&…

mac屏幕截图_如何在Mac上拍摄屏幕截图

mac屏幕截图On a Mac, you can take screenshots with a few quick keyboard shortcuts. But Mac OS X also includes more powerful screenshot tools, too. Here are some of the many ways you can get a screenshot on OS X. 在Mac上,您可以使用一些快速的键盘快…

实现 .Net 7 下的数据库定时检查

在软件开发过程中,有时候我们需要定时地检查数据库中的数据,并在发现新增数据时触发一个动作。为了实现这个需求,我们在 .Net 7 下进行一次简单的演示。PeriodicTimer .Net 6 中新增了 PeriodicTimer 这个类,它可以用来创建一个定…

新手AS常见问题集锦

开发环境 以前开发android的时候可以使用eclipse,虽然现在也能使用eclipse,但是google已经不再支持使用eclipse开发android了。因为google有了自己的IDE---android studio,这个IDE我自己认为安装的时候比较方便,唯一的缺点就是在下…

js进阶 11-6 jquery如何获取和设置元素的宽高(jquery多方法)

js进阶 11-6 jquery如何获取和设置元素的宽高(jquery多方法) 一、总结 一句话总结:jquery里面多是方法啊,比如jquery对象的宽高。所以取值是方法,赋值就是方法里面带参数。 1、百度富文本编辑器ueditor如何设置宽高&a…