zoukankan      html  css  js  c++  java
  • JQuery实现放大镜


    640?wx_fmt=jpeg&wxfrom=5&wx_lazy=1

    PS:由于无法上传文件,所以感兴趣的朋友可以搜索公众号“ITyuanshu”,回复“8”获取整套源码

    <!DOCTYPE html5>

    <html>

    <head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>jQuery图片放大镜插件</title>

    <link rel="stylesheet" type="text/css" href="demo/styles/index.css" />

    <link rel="stylesheet" type="text/css" href="demo/styles/prism.css" />

    </head>

    <body>

    <br><br><br>

    <img src="demo/img/waldo.jpg" class="demo-img pos-center">

    <p>鼠标移上去试试!</p>

    <br>

    <script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>

    <script type="text/javascript" src="js/blowup.min.js"></script>

    <script type="text/javascript" src="demo/scripts/prism.js"></script>

    <script type="text/javascript">

    $(document).ready(function () {

    $(".demo-img").blowup({

    background : "#FCEBB6"

    });

    })

    </script>

    <div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">

    </body>

    </html>


  • 相关阅读:
    如何改变checkbox的样式
    EChart.js 简单入门
    Javascript异步编程的4种方法
    手写手机网站
    Handlebars的基本用法
    装饰器
    using Newtonsoft.Json;
    chrome插件学习笔记
    绩效考核如何快速评分
    wx jssdk
  • 原文地址:https://www.cnblogs.com/hgmyz/p/12352592.html
Copyright © 2011-2022 走看看