Jquery——点击显示图片+突出显示

最新推荐文章于 2021-02-19 13:40:44 发布

Zjaun

最新推荐文章于 2021-02-19 13:40:44 发布

阅读量877

点赞数

分类专栏： JQ 文章标签： JQuery

本文链接：https://blog.csdn.net/Zjaun/article/details/87216446

版权

这篇博客介绍了如何使用Jquery实现图片点击显示并突出显示的效果。通过CSS和Body的设置，实现了鼠标滑过图片时图片变亮，其他图片变暗的排他效果。

摘要由CSDN通过智能技术生成

css+body

<style type="text/css">
    body {
      font-family: "Helvetica", "Arial", serif;
      color: #333;
      background-color: #ccc;
      margin: 1em 10%;
    }

    h1 {
      color: #333;
      background-color: transparent;
    }

    a {
      color: #c60;
      background-color: transparent;
      font-weight: bold;
      text-decoration: none;
    }

    ul {
      padding: 0;
    }

    li {
      float: left;
      padding: 1em;
      list-style: none;
    }

    #imagegallery {
      list-style: none;
    }

    #imagegallery li {
      margin: 0px 20px 20px 0px;
      padding: 0px;
      display: inline;
    }

    #imagegallery li a img {
      border: 0;
    }
  </style>

<body>
  <h2>
    美女画廊
  </h2>

  <ul id="imagegallery">
    <li><a href="images/1.jpg" title="美女A">
        <img src="images/1-

最低0.47元/天解锁文章

Zjaun

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
Jquery——点击显示图片+突出显示

css+body&amp;lt;style type=&quot;text/css&quot;&amp;gt; body { font-family: &quot;Helvetica&quot;, &quot;Arial&quot;, serif; color: #333; background-color: #ccc; margin: 1em 10%; } h1 {
复制链接

扫一扫

专栏目录