-
jQuery判断鼠标向上滚动并浮动导航
判断鼠标向上滚动,或者向下滚动,可以通过对比用户的上一次滚动的坐标和下一次的坐标,当上一次小于下一次时,即用户在向下滚动,反之,则说明用户在向上滚动。滚动的坐标值可以取窗口的 scrollTop。为啥会有这个需求呢?有没有发现在一国外的一些网站,当你向上滚动时,导航条浮动在顶部位置。用户如果是想看内容就可以直接点击到达,省去很多拖动的时间,当然返回顶部也是比较容易。但有时候返回顶部这个按钮往往被人…- 6
- 0
-
图片垂直水平居中CSS实现方法
在前端开发制作中,图片垂直居中对齐是很常见的,有些是固定高度,有些没有固定高度,分享几种使用 CSS 实现图片垂直&&水平居中的方法,有些可能并不能兼容所有浏览器,大家可以自行选择: 方法一: html { width:100%; height:100%; background:url(logo.png) center center no-repeat; } 方法二: img { …- 3
- 0
-
WordPress 为媒体添加自定义字段
WordPress 中,我们可以很轻松的使用插件或者写代码为文章或页面添加自定义字段。可能是因为使用的场景不多,支持为媒体添加自定义字段的插件和教程确很少。 在这篇文章中,我们一起来看一下怎么为 WordPress 媒体添加自定义字段。实现代码其实很简单,也完全没必要用插件来实现。最终实现的效果如下图所见。 首先,为媒体添加自定义字段表单 在下面的代码中,我们使用 attachment_field…- 3
- 0
-
font-face 字体文件跨域解决办法字体跨域
开发网站的时候经常会调用不同域名下的字体文件(同源策略禁止读取位于 ttf 文件),但是出现无限的情况,提示如下:已拦截跨源请求: 同源策略禁止读取位于 https://www.weimahe.com/fonts/fontawesome-webfont.woff?v=4.7.0 的远程资源。(原因:CORS 头缺少 ‘Access-Control-Allow-Origin’) 已拦截跨源请求:同源…- 7
- 0
-
DIV不确定高度内部元素水平垂直居中的方法归纳
总结当前知道的对 div 嵌套标签水平垂直居中方法,如果还有新的方法,请不吝赐教哦。好,下面开始列举代码咯。首先给需要实现水平垂直居中的两个 div 设置统一的样式: .styl { width: 100%; height: 300px; background: #ccc; margin: 30px auto; position: relative; border: 1px solid #000;…- 9
- 0
-
CSS控制文本两端对齐对最后一行无效解决方法
做前端的朋友对 text-align 这个属性肯定是在熟悉不过了,经常用 left、right、center 来控制行内元素相对父元素左、右、居中对齐排版,justtify 来实现文本的两端对齐,让一段多行文本看起来更方便阅读,排版更好看。 两端对齐相对于左对齐,视觉上显得整齐有序。但 justify 对最后一行无效,通常这样的排版对整段文字是极好的,我们并不希望当最后一行只有两个字时也两端对齐,…- 6
- 0
-
jQuery 检测字符串是否含有中文
我们做好网站之后,如果网站前台有提交表单,经常会出现被恶意发布信息。而且内容都英文,这时,我们可以通过 jQuery 检测字符串是否含有中文来解决这些垃圾留言,jQuery 检测字符串是否含有中文代码很简单: //判断字符串是不是中文 String.prototype.isChinese = function () { var reg = /[^\x00-\xff]/ig;//判断是否存在中文和全…- 3
- 0
-
jQuery 监听 textarea 文本段数据行数方法
在做网站时,少不了一些表单,在前面的教程中,我们介绍了怎么给表单 textarea 文本域添加行号。如果在表单里如果我们想限制用户的输入数据的行数,可以通过 JQUERY 代码来实现监听。以下是 jquery 监听 textarea 数据行数方法: $("#textarea").val().split("\n").length 通过这个监听的数据,我们也可以…- 3
- 0
-
CSS样式表属性最佳书写顺序是怎样的?
好久没有更文了,博客都要荒废了,惭愧一下下,刚好这段时间稍微整理了一下之前写的样式表,就来说下 CSS 样式表中各个属性的书写顺序是怎样的。 像很多初学者一样,飞鸟刚开始写样式表也是很佛系的,想到什么就在样式里写什么,毫无规律。其实这样不仅不利于查看维护,更重要的是混乱的 CSS 属性书写顺序会对网页的加载渲染造成影响,拖慢页面加载速度。也就是说,一个规范的 CSS 属性书写属性也是网页优化的组成…- 12
- 0
-
利用:hover伪类实现鼠标指向区块滑出小提示效果
本文利用 css 中:hover 伪类实现将鼠标指向某区块时,区块内部滑出小提示效果,应用场景如广告上招商功能,一起来看一下。之前在某个平台发现了一个很有趣的效果,广告上有一个小按钮,当鼠标指向广告的时候,小按钮处侧滑出一个文本提示“也想在这里显示?联系我们吧”这种类似于“百度联盟图加 wap”版的效果瞬间让我觉得体验很棒,还能够起到“招商”的效果。当时准备拔下来,却发现人家启用了防扒代码功能,一…- 10
- 0
-
给菜单中UL下的某一个或某几个LI添加自定义类
我们有时候在定制 WORDPRESS 主题的时候,由于菜单样式的要求我们需要给我们的 WordPress 获取到的菜单中的 UL 下的某一个或某几个 LI 添加自定义的类,比如我给客户设置制作的这个主题中,因为 LOGO 在菜单中间显示,所以我需要第四个菜单和第五个菜单的右边和左边流出一定的距离来显示 LOGO,那么这个时候如果我能给第思个菜单和第五个菜单的 LI 分别添加一个自定义类,那么我就可…- 4
- 0
-
移动端自适应样式@media的使用方法
通用手机端样式: @media all and (orientation : portrait) { /*竖屏*/ } @media all and (orientation : landscape) { /*横屏*/ } 指定手机端高度样式: @media screen and (max-width: 750px) @media screen and (min-width: 720px) and…- 5
- 0
-
JS实现静态页面搜索并高亮显示的方法
本文实例讲述了 JS 实现静态页面搜索并高亮显示功能。分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>JS搜索</title> </head> <…- 7
- 0
-
jQuery 实现点击选中改变当前样式
在做网站时,有些栏目元素有选择性,当我们点击某个栏目时,它会显示出不同于其它的样式,而没有被点击的,就恢复正常样式。效果如下图: 怎么在自己做网站时,实现这样的点击后改变当前样式的效果呢?这就需要使用 JQUERY 代码了。以下是 JQUERY 实现点击选中改变当前样式代码。 <script> $("#meau_nav>div").click(function…- 4
- 0
-
jQuery获取其他网页内容并插入到当前页面div或input
在页面中引入 jquery 来获取其他网页的内容并且插入到当前页面 div 或 input 中的方法。 当前页代码 <script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> <script>…- 8
- 0
-
轻松解决 li 标签上边缘间隙问题
今天在调整网站评论模块样式的时候,发现 <li> 标签中上边缘有一个小小的间隙,虽然影响不大,但是对于一个有着深度强迫症的伪程序员,当然是要解决它。具体问题如下: 原因好像是插入的 <input> 标签的影响,解决方式也很简单,直接设置 CSS 为 float: left; 即可。- 3
- 0
-
根据user-agent判断客户端是PC、安卓、苹果显示不同内容
今天接到一个做客户的单子,他要求安卓、苹果、PC 端打开的页面显示不同的 APP 下载链接!目前用电脑上的浏览器,android 设备,iphone,ipad 均做过测试,此代码可行,各设备判断均正确。分享给有需要的人,大牛请绕道~ HTML 代码 <div class="download link" id="downloadSHY"> <…- 12
- 0
-
CSS3渐变色的实现方法讲解
在进行网页编程的时候有很多时候都会用到渐变色,但是 CSS2 处理渐变色比较困难,CSS3 就比较方便了,所以今天余斗就教大家用 CSS3 实现渐变色功能。 CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的过渡。以前,你必须使用图像来实现这些效果。但是,通过使用 CSS3 渐变(gradients),你可以减少下载的时间和宽带的使用。此外,渐变效果的元素在放大时看起…- 12
- 0
-
JS实现点击弹出层再点击任意位置隐藏弹出层
我们经常使用到弹出层。对于弹出层,原本的意义就是增加与用户的交互,提升用户的好感度。我们在使用的时候需要注意几个弹出层的注意点: 弹出层的界面需要统一,不一致的弹出层并不能增加美感,相反还会显得页面布局更加杂乱无章; 弹出层的设计一定要好看,按钮要符合项目的主色调; 弹出层的宽度固定屏幕占比,设置 max-width,高度根据内容自适应; 点击其他区域能隐藏弹出层。 今天,主要说说点击其他区域隐藏…- 13
- 0
-
实现滚动时动态缩小导航栏jQuery效果
我们先先看一下下面的效果,用 QQ 截的图,效果很不清楚,但是能说明问题。怎么实现这样的效果呢?用得比较多的算是 jQuery 的 waypoints 插件了,其实不用 jQuery 插件,很简单的一段 jQuery 代码就可以实现这样的效果,不过要结合 CSS3 过渡,IE9 以下的浏览器效果可能就差一点了。 实现以上效果的关键代码如下。首先,用 jQuery 判断网页滚动,网页滚动的高度大于 …- 3
- 0
-
Javascript 实现虚线边框旋转效果
看到百度 ueditor 编辑器网站首页,底部有一个滚动虚框的效果(原谅我不会做 gif 图),如图: 就去看了一下,开始以为是 CSS,后来打开 F12 ,哦原来是 js,那就尝试写一下吧。 HTML 部分 <div class="box"> <div class="topBorder" id="J_borTop"&g…- 8
- 0
-
jQuery 鼠标滑过链接图片滑动展开与隐藏效果
这篇文章主要介绍了 jQuery 实现鼠标滑过链接控制图片的滑动展开与隐藏效果,涉及 jQuery 鼠标事件的响应及链式操作的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下。 这里演示 jQuery 实现鼠标移动到链接上,滑动展开/隐藏图片效果,鼠标放在“上一页”“下一页”上,立即浮现出所对应的图片,有点提前预览的味道,让用户知道下一页或下一页的大致内容,很好的提升了用户体验。运行效果截图如…- 5
- 0
-
CSS实现边框透明的方法
透明一般认为是一种颜色属性,但是并没有这个数值。我们找到了一种让边框实现透明的最佳方案,运用 RGBA 设置。 css 可以使用 RGBA 设置边框透明,RGBA 在 RGB 的基础上多了控制 alpha 透明度的参数,我们使用 RGBA 设置边框颜色同时可以设置边框透明度。RGBA 在 RGB 的基础上多了控制 alpha 透明度的参数。R(红)、G(绿)、B(蓝)三个参数,正整数值的取值范围为…- 4
- 0
-
jQuery 检查一个元素是否存在然后按需加载内容
前端开发的过程中,我们会使用很多 jQuery 插件,jQuery 插件使用得多了,会导致网页打开速度变慢。而引入的 jQuery 插件并不是每个页面都需要的。这时候使用按需加载的方法加载 jQuery 插件会对前端性能的提升有不少帮助。按需加载的方法有很多,今天我们来说一下 jQuery 的方法。判断网页中一个元素是否存在的方法: var $selector = $('.my-elem…- 3
- 0
幸运之星正在降临...
点击领取今天的签到奖励!
恭喜!您今天获得了{{mission.data.mission.credit}}积分
我的优惠劵
-
¥优惠劵使用时效:无法使用使用时效:
之前
使用时效:永久有效优惠劵ID:×
没有优惠劵可用!