css js 特效

CSS和JS特效是Web开发中常见的技巧。使用它们可以增强网站的外观和交互性。接下来，我们将介绍一些CSS和JS特效的例子。

/* CSS特效 */
/* 悬停变化颜色 */
a:hover {
  color: red;
}
/* 渐变背景色 */
body {
  background: linear-gradient(to bottom right, #FFC0CB, #1E90FF);
}
/* 边框动画 */
button {
  border: 2px solid #1E90FF;
  transition: border-color 0.3s ease-in-out;
}
button:hover {
  border-color: pink;
}

/* JS特效 */
/* 鼠标跟随特效 */
document.addEventListener("mousemove", function(e){
  var x = e.clientX;
  var y = e.clientY;
  var circle = document.getElementById("circle");
  circle.style.left = x + "px";
  circle.style.top  = y + "px";
});

/* 折叠展开效果 */
$(document).ready(function(){
  $(".accordion").click(function(){
    $(this).next().slideToggle("slow");
    $(this).toggleClass("active");
  });
});

总之，CSS和JS特效可以为网站带来更好的用户体验。但要注意不要滥用特效，否则可能会导致页面加载变慢。