-
终极代码禁止查看网页源代码方法
总是有新手问，如何禁止别人查看自己的网页源代码？答案是没有，对于有经验者所有方法都是徒劳的。一般常用的方法是在网页中加上类似的 JS 代码，屏蔽屏蔽键盘和鼠标右键。 document.onkeydown = function() { var e = window.event || arguments[0]; if (e.keyCode == 123) { alert('禁止F12…...- 0
- 0
- 4
-
轻松解决 li 标签上边缘间隙问题
今天在调整网站评论模块样式的时候，发现 <li> 标签中上边缘有一个小小的间隙，虽然影响不大，但是对于一个有着深度强迫症的伪程序员，当然是要解决它。具体问题如下： 原因好像是插入的 <input> 标签的影响，解决方式也很简单，直接设置 CSS 为 float: left; 即可。...- 0
- 0
- 3
-
几行代码搞定CSS项目名称两端对齐
最近这两天因为疫情的原因闲下来了，无聊又调整了调整自己的主题，在调整过程中因为有些项目需要两端对齐，所以便有了这篇文章，说到两端对齐，大家并不陌生，在 word、powerpoint、outlook 等界面导航处，其实都有一个两端对齐(分散对齐)的按钮，平时使用的也不多，我们更习惯与左对齐、居中对齐、右对齐的方式来对齐页面的文本或模块。响应式网页设计出现以来，更多是使用百分比布自适应布局，特别是在…...- 0
- 0
- 3
-
Audio 标签播放音频怎样隐藏下载按钮？禁止另存为？
有时候我们喜欢分享一些音频音乐，大部分应该会用插件来实现，调用网易或者 QQ 音乐。但是毕竟不是每首歌都能在某一平台找到，或者音质不理想，所以往往使用 audio 标签也就能满足了。但是 audio 标签的前台显示会有一个下载按键或者能右键另存为，这个就很不讨喜，如何隐藏呢？正常情况下，我们使用 audio 标签分享音频，前台显示会出现如下效果，会有一个下载的按钮，这个完全没有必要，还有不好的影响…...- 0
- 0
- 3
-
根据user-agent判断客户端是PC、安卓、苹果显示不同内容
今天接到一个做客户的单子，他要求安卓、苹果、PC 端打开的页面显示不同的 APP 下载链接！目前用电脑上的浏览器，android 设备，iphone，ipad 均做过测试，此代码可行，各设备判断均正确。分享给有需要的人，大牛请绕道~ HTML 代码 <div class="download link" id="downloadSHY"> <…...- 0
- 0
- 5
-
CSS文字超出部分隐藏并显示省略号
网站前端开发中 web 网页中文字超出了需要隐藏，并显示省略号这个在工作中很多时候都要用到，我想很多人都碰到过吧，实现这个效果有两种解决方法，大致如下： 一是用程序开截取字符长度，这个其实也是可以的，但是并不利于 SEO 优化，因为搜索引擎得到的也只是截取的长度 第二种是用 css 样式来做,这种只会隐藏超出部分，实际上隐藏的文字还是在 html 代码中只是没有被显示出来，这样搜索引擎也能够准确读…...- 0
- 0
- 3
-
CSS3渐变色的实现方法讲解
在进行网页编程的时候有很多时候都会用到渐变色，但是 CSS2 处理渐变色比较困难，CSS3 就比较方便了，所以今天余斗就教大家用 CSS3 实现渐变色功能。 CSS3 渐变（gradients）可以让你在两个或多个指定的颜色之间显示平稳的过渡。以前，你必须使用图像来实现这些效果。但是，通过使用 CSS3 渐变（gradients），你可以减少下载的时间和宽带的使用。此外，渐变效果的元素在放大时看起…...- 0
- 0
- 7
-
JS实现点击弹出层再点击任意位置隐藏弹出层
我们经常使用到弹出层。对于弹出层，原本的意义就是增加与用户的交互，提升用户的好感度。我们在使用的时候需要注意几个弹出层的注意点： 弹出层的界面需要统一，不一致的弹出层并不能增加美感，相反还会显得页面布局更加杂乱无章； 弹出层的设计一定要好看，按钮要符合项目的主色调； 弹出层的宽度固定屏幕占比，设置 max-width，高度根据内容自适应； 点击其他区域能隐藏弹出层。 今天，主要说说点击其他区域隐藏…...- 0
- 0
- 5
-
前端开发 CSS 常见布局方式学习及总结
对于很多前端开发人员来说，CSS 布局应该是日常工作中碰到最多的东西之一，但是让我迷惑的是有很多文章 关于布局名词都没有听说过，工作中也很少用。一个好的布局不仅可以减少代码的书写量，而且有助于我们理解页面结构，更好地实现多种页面效果。学习一段时间了，但对于 CSS 布局方法的掌握一直比较混乱，而一般情况下我们对页面布局最常用到的当属 float、display、position 这三个属性了，我们…...- 0
- 0
- 4
-
实现滚动时动态缩小导航栏jQuery效果
我们先先看一下下面的效果，用 QQ 截的图，效果很不清楚，但是能说明问题。怎么实现这样的效果呢？用得比较多的算是 jQuery 的 waypoints 插件了，其实不用 jQuery 插件，很简单的一段 jQuery 代码就可以实现这样的效果，不过要结合 CSS3 过渡，IE9 以下的浏览器效果可能就差一点了。 实现以上效果的关键代码如下。首先，用 jQuery 判断网页滚动，网页滚动的高度大于 …...- 0
- 0
- 3
-
CSS代码轻松实现虚线边框滚动动画
百度 ueditor 编辑器网站首页底部有一个滚动虚框的效果，如下 GIF 示意： 当时我看到这个效果的时候，很兴奋，没想到做这个官网页面的还是个 CSS 牛人！等我打开控制台一看——恩，原来是 JS 计算实现的，我就默默地关掉了页面，假装刚才什么都没发生过。 实际上，这种效果三两行 CSS 代码就可以实现，且 IE10+浏览器都支持。 <div class="box"&…...- 0
- 0
- 2
-
两行CSS代码实现最简单瀑布流实现方式
昨天无聊写了个随机一套图的小程序接口，在写 HTML 的时候遇到了让人难受的 css，百度后找到一位大神提供的办法，以后图片瀑布流都是垃圾，两行代码就够了！感觉自己膨胀了哈，下面一起来看看效果。 代码很简单，只需要给包裹所有图片的元素设置一个 CSS 样式，然后给包裹一张图片的元素设置一个样式即可。比如 <ul> <li><a href="xxxx"…...- 0
- 0
- 2
-
Javascript 实现虚线边框旋转效果
看到百度 ueditor 编辑器网站首页，底部有一个滚动虚框的效果(原谅我不会做 gif 图)，如图： 就去看了一下，开始以为是 CSS，后来打开 F12 ，哦原来是 js，那就尝试写一下吧。 HTML 部分 <div class="box"> <div class="topBorder" id="J_borTop"&g…...- 0
- 0
- 5
-
JS判断浏览器环境（pc端，移动端，还是微信浏览器）
今天突然看到一段很好的代码，分享给大家，顺便也给自己留个笔记。我们部署在 Web 服务器上的前端应用，既可以用 PC 浏览器访问，也可以用手机浏览器访问，再加上现在智能设备的推广，我们甚至能在车载系统、穿戴设备和电视平台上访问。设备的多样化让用户无处不在，有时候我们需要根据不同的浏览器运行环境做出对应的处理。浏览器是 JavaScript 的承载体，我们可以从浏览器上获取相关的信息，来进一步处理我…...- 0
- 0
- 11
-
jQuery 通过class名称验证表单值不为空
我们在使用 CMS 系统开发网站的时候，经常需要验证表单数据为必填项，若用 jQuery 通过 ID 去验证，不仅会影响效率，还会有所遗漏，不易于后期维护。 本章将介绍如何利用 jQuery，通过为表单配置 class 进行统一验证。（ID 一个页面只可以使用一次，class 可以多次引用） 1：为 input 添加 class，名字可以随意设置，但每个 input 需要保持一致，本章案例 cal…...- 0
- 0
- 12
-
CSS3中鼠标滑过图片突出放大效果
这篇前端教程是友联站长发布的，刚刚看了下感觉还不错，纯 CSS 实现，虽然在开发主题时 CSS3 用的比较少。这是一款简单实用的 CSS3 鼠标滑过图片放大特效，我们可以将它应用在相册中，或者是轮播展示的图片中，这样可以将鼠标移到图片上进行快速预览图片。同时你也可以在此基础上扩展它，比如给图片加投影和边框等。整一个图片放大特效还是比较酷的。 HTML 代码 <div class="…...- 0
- 0
- 10
-
jQuery 鼠标滑过链接图片滑动展开与隐藏效果
这篇文章主要介绍了 jQuery 实现鼠标滑过链接控制图片的滑动展开与隐藏效果，涉及 jQuery 鼠标事件的响应及链式操作的相关技巧，具有一定参考借鉴价值，需要的朋友可以参考下。 这里演示 jQuery 实现鼠标移动到链接上，滑动展开/隐藏图片效果，鼠标放在“上一页”“下一页”上，立即浮现出所对应的图片，有点提前预览的味道，让用户知道下一页或下一页的大致内容，很好的提升了用户体验。运行效果截图如…...- 0
- 0
- 5
-
CSS实现边框透明的方法
透明一般认为是一种颜色属性，但是并没有这个数值。我们找到了一种让边框实现透明的最佳方案，运用 RGBA 设置。 css 可以使用 RGBA 设置边框透明，RGBA 在 RGB 的基础上多了控制 alpha 透明度的参数，我们使用 RGBA 设置边框颜色同时可以设置边框透明度。RGBA 在 RGB 的基础上多了控制 alpha 透明度的参数。R（红）、G（绿）、B（蓝）三个参数，正整数值的取值范围为…...- 0
- 0
- 3
-
PHP 实现图片 Base64 编码与解码
我们在传输和处理图片时，Base64 是一个常用的选择，PHP 中就有函数（base64_encode 和 base64_decode）分别负责图片 Base64 编码和图片 Base64 解码，老王昨天在网上找到 2 段关于图片 Base64 编码和解码的 PHP 代码实现，用起来还不错，这里与大家做个分享。 一、PHP 实现图片 Base64 编码 实现思路主要就是先将图片流读取到 ->…...- 0
- 0
- 9
-
代码实现给网站添加返回顶部功能
代码实现给网站添加返回顶部功能，瀑布流风格的网站开始流行之后，很多网站都出现了一个回到顶部的功能，对于瀑布流布局的网站来讲，这可以说是必须要有的一个功能，因为网站下拉了很长之后，需要返回顶部的时候，如果拖着滚动条去拉，那种麻烦相信大家都体验过。 对于非瀑布流网站来说，增加这种效果必要性其实不大，除非你的网站上文章很长，用户需要看好几屏才能看完。需不需要是基于用户体验上的考虑，咱在这里先按下不说，下…...- 0
- 0
- 8
-
jQuery 检查一个元素是否存在然后按需加载内容
前端开发的过程中，我们会使用很多 jQuery 插件，jQuery 插件使用得多了，会导致网页打开速度变慢。而引入的 jQuery 插件并不是每个页面都需要的。这时候使用按需加载的方法加载 jQuery 插件会对前端性能的提升有不少帮助。按需加载的方法有很多，今天我们来说一下 jQuery 的方法。判断网页中一个元素是否存在的方法： var $selector = $('.my-elem…...- 0
- 0
- 3
-
CSS3 Flexbox 弹性布局教程 & 实操案例
我们知道在 Web 短暂的历史中，设计师用过多种不同的网页布局方式。一开始，设计师依靠 HTML 表格组织内容，把页面分成多行和多列。可是，HTML 中的 table 标签原本就不是为页面布局而生的。后来出现了 CSS 盒基于浮动的布局，使用这种方法控制页面布局更简单，也更加符合逻辑。 如今，基于浮动的布局仍然是最常用的方法，而且设计师一直在改进其用法。例如，栅格系统就是创建布局的得力工具，不过其…...- 0
- 0
- 7
-
最简单的HTMML5下拉菜单样式表代码分享
下拉菜单是 wordpress 程序主题里面最常用的菜单体验方式，但是大多新手的对于菜单的使用和调整方式并不理解，尤其是不懂样式表的同学操作起来很加的困难，所以这里给大家提供了现成的样式表代码样式，可以直接复制过去就可以呈现下拉的形态，并且可以直接用于 wordpress 主题的调整中，在对应的代码里添加一下菜单 函数就可以成功应用在现有的主题上，是不是十分的方便。 <style> /…...- 0
- 0
- 2
-
Zepto Lazy 实现CSS背景图像实现延迟加载jQuery插件
Zepto Lazy 实现 CSS 背景图像实现延迟加载 jQuery 插件，我们知道大部网站使用的图片延迟加载只对 img 标签中 src 属性的图片起作用，对 CSS 背景（background-image）中的图片无效，例如： <div class="lazy" style="background-image: url(54.jpg);">…...- 0
- 0
- 1
-
￥优惠劵使用时效：无法使用使用时效：
之前
使用时效：永久有效优惠劵ID：×