![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端技术
懒得安分
这个作者很懒,什么都没留下…
展开
-
各大网站变灰css主页变灰代码
【代码】B站网站变灰css主页变灰代码。原创 2022-12-02 10:24:56 · 226 阅读 · 1 评论 -
H5+CSS3实现简单菜单下划线动画
废话不说,先上图: 效果是用css3的:after来实现的,不增加或改变html;绝对定位把横线定在菜单顶部或底部,不影响文档流。代码部分:/*html*/<ul> <li><a href=#>link1</a></li> <li><a href=#>link2</a></li> <li><a href=#>link3</a></li></ul>/*css*原创 2017-09-27 12:11:26 · 7878 阅读 · 1 评论 -
js 跳转链接的几种方式
跳转链接 在当前窗口打开window.location.href="http://www.baidu.com";//等价于<a href="baidu.com" target="_self">go baidu</a> 跳转链接 在新窗口打开window.open("http://www.baidu.com");//等价于 <a href="bai...转载 2019-03-26 09:55:13 · 3983 阅读 · 0 评论 -
移动端手机网页强制横屏或全屏模仿横评的js和css3方法
移动端手机网页强制横屏或全屏模仿横评的js加css3方法最近项目有电子合同方面的开发,需要电子签字,(用的jsignature插件,如果有空以后单独写个使用心得)。在手机小屏幕上签字,全屏横屏才是最好的体验。用户竖屏打开页面时要去签字,提示用户把手机横过来,这样体验太low了,程序员要考虑能用技术解决的就不要去劳烦用户(免得他烦了回头打电话咬你)。先来几个检测屏幕方向的方法://判断屏幕方向if原创 2017-08-17 17:25:07 · 27016 阅读 · 10 评论 -
现代高级浏览器的通知功能
chrome要求网站必须为https协议 if (!("Notification" in window)) { alert("此浏览器不支持桌面通知"); } // 检查是否授予通知权限 else if (Notification.permission === "granted") { // 如果ok,我们来创建一个通知 var notification=new Notif...原创 2019-02-13 16:01:11 · 405 阅读 · 0 评论 -
标准bootstrap3 form表单美化
/*文本框美化*/ .form-control[type='text'], .form-control[type='password'] { padding-left: 20px; } .form-group:last-child label:before { position: a...原创 2019-01-31 18:05:07 · 7910 阅读 · 1 评论 -
js判断移动设备横屏竖屏状态
在移动WEB开发中,有些场景需要判断设备的横竖屏状态,在发现orientation方法之前我用的是获取设备的宽高来判断://判断横竖屏$(window).resize(() => { let w = $("body").width(); let h = $("body").height(); if (w > h) { alert("横屏");...原创 2019-01-10 11:44:28 · 1335 阅读 · 0 评论 -
js 利用iframe 局部打印
var el = &quot;&amp;lt;img src='//xxx.jpg'&amp;gt;&quot;;var iframe = document.createElement('IFRAME');iframe.setAttribute('style', 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;');document.body.app...原创 2019-01-21 10:26:09 · 8668 阅读 · 2 评论 -
grayscale.js 网站快速变为灰色主题小记
需求:甲方会长去世,要求把网站改成灰色以示哀悼;接到需求,开始是想改样式和图片,但是想着512当时那么多网站都改变过,一定有简便一点的方法,到网上看了几篇帖子,大多都是改样式的,只有一个是用js实现的,而且可以实现全局效果(大快我心),兼容性也很好(在Opera 9,FF2 / 3,Safari 4,IE6 / 7中成功测试)测试后只是加载效率低了点,其他没别的问题。这就是grayscale...原创 2019-01-02 15:18:20 · 11715 阅读 · 2 评论 -
百度 WebUploader 单图片上传 简单的使用方法
小记一次使用WebUploader的基本方法,如有欠妥,恳请指教~感谢Baidu FEX 团队开发出这么好的上传组件引入资源这儿不过多赘述了,官方Getting Started已经写的很明白了,我直接用了demo上的代码。图片上传option先上代码 // 初始化Web Uploader uploader = WebUploader.create({ //...原创 2018-12-07 16:04:20 · 1008 阅读 · 0 评论 -
百度地图鹰眼轨迹基本参数示例
/** * 首先创建好ak与鹰眼服务 * 创建一个entity * PSOT:http://yingyan.baidu.com/api/v3/entity/add */{ "ak":"你的ak", "service_id":"你的server_id", "entity_name":"单个实体(汽车)的标识", "entity_desc&q原创 2018-08-17 18:01:59 · 5287 阅读 · 11 评论 -
登录框 纯css自适应居中
用负值与50%定位,实现自适应居中。&amp;amp;lt;div class=&amp;quot;login-box&amp;quot;&amp;amp;gt; /*input*/&amp;amp;lt;/div&amp;amp;gt;&amp;amp;lt;style&amp;amp;gt; .login-box{ width:5原创 2018-04-22 14:21:17 · 4183 阅读 · 0 评论 -
em与rem的区别:何时使用em与rem
教程亘长,这里只提供总结,若想知道个所以然还请点击链接查看原文总结:rem 和 em 单位是由浏览器基于你的设计中的字体大小计算得到的像素值。em 单位基于使用他们的元素的字体大小。rem 单位基于 html 元素的字体大小。em 单位可能受任何继承的父元素字体大小影响rem 单位可以从浏览器字体设置中继承字体大小。使用 em 单位应根据组件的字体大小而不是根元素的字体...转载 2018-04-02 11:43:57 · 641 阅读 · 0 评论