日度归档:2020年2月15日

CSS3 如何使用css脚本实现文本后面不断有流光滑过的效果呢?


摘要:
下文讲述使用css脚本实现,一个文本的背景中出现光一闪而过的效果,如下所示:


实现思路:
将背景按文本域裁剪
设置背景为一个渐变色
设置一个背景位置变化的动画
————注意事项———–
此属性为css3的新属性,IE浏览器中可能会失效

例:
实现一个文字金光闪闪滚动的效果


<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.maomao365.com/" />
<title>猫猫教程(www.maomao365.com)--文字金光闪闪动画的效果</title>
<style>
span{
  width: 50%;
  margin: 0 auto;
  line-height: 50px;
  font-size: 50px;
  text-align: center;
  /*背景色根据文字进行裁剪*/
  -webkit-background-clip: text;
  /*设置文字的颜色为背景色*/
  -webkit-text-fill-color: transparent;
  /*设置背景颜色*/
  background-color: red;
  /*设置背景渐变,对角线渐变*/
  background-image:-webkit-linear-gradient(-45deg,rgba(0,0,0,0.6) 50%,blue 50%,rgba(0,0,0,0.6) 90%);
  background-size: 200%;
  /*为背景添加动画信息*/
  -webkit-animation: dongHua 2s infinite;
}
@keyframes dongHua  {
  from {
    background-position: 100%;
  }
  to {
    background-position: 0;
  }
}
</style>
</head>
<body>
<span>猫猫教程(www.maomao365.com)--文字金光闪闪</span>
</body>
</html>
css 实现文字金光闪闪的效果

css 实现文字金光闪闪的效果

JavaScript中js判断函数是否存在呢?


摘要:
下文通过举例的方式讲述js中判断函数存在的方法分享,如下所示:


实现思路:
通过使用type of函数 检测函数是否存在

例:

<script>     
  //猫猫教程--检测函数是否存在的方法分享
  function functionCheckExists(funcName){
  try {
    if (typeof(eval(funcName)) == "function"){
      return true;
    }
  } 
  catch(e) {}
  return false;
}
var  t=function(){} 
 
 //测试方法可行性
alert(functionCheckExists(t));
 
</script>
javascript 判断函数是否存在

javascript 判断函数是否存在

javascript 中e.preventDefault()方法的功能说明


摘要:
下文讲述javascript中e.preventDefault()方法的功能说明,如下所示:


e.preventDefault() 功能

取消当前事件的默认动作
e.preventDefault() 常用于禁用web页面中某某功能,例:禁用网页右键,禁用某某按键等功能。


e.preventDefault() 举例说明

例:
禁用网页右键的默认事件

//实现思路:
//在网页右键上绑定相应的js函数,然后在函数中加入 e.preventDefault 则可以起到禁用网页右键的功能

 window.oncontextmenu = function(e) {
    e.preventDefault()
 }