<div class="imgbox cf">
    <img src="temp/pic2.jpg" alt="" class="big_pic" id="big_pic">
    <div class="sm_img" id="sm_img">
        <img src="temp/pic2.jpg" alt="" onmouseover="document.getElementById('big_pic').src='temp/pic2.jpg'">
        <img src="temp/pic1.jpg" alt="" onmouseover="document.getElementById('big_pic').src='temp/pic1.jpg'">
        <img src="temp/pic2.jpg" alt="" onmouseover="document.getElementById('big_pic').src='temp/pic2.jpg'">
        <img src="temp/pic1.jpg" alt="" onmouseover="document.getElementById('big_pic').src='temp/pic1.jpg'">
        <img src="temp/pic2.jpg" alt="" onmouseover="document.getElementById('big_pic').src='temp/pic2.jpg'">
        <img src="temp/pic1.jpg" alt="" onmouseover="document.getElementById('big_pic').src='temp/pic1.jpg'">
        <img src="temp/pic2.jpg" alt="" onmouseover="document.getElementById('big_pic').src='temp/pic2.jpg'">
        <img src="temp/pic1.jpg" alt="" onmouseover="document.getElementById('big_pic').src='temp/pic1.jpg'">
        <img src="temp/pic2.jpg" alt="" onmouseover="document.getElementById('big_pic').src='temp/pic2.jpg'">
    </div>
</div>

js点击图片显示在左边大图的更多相关文章

  1. 一天JavaScript示例-点击图片显示大图片添加鼠标

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  2. JQuery - 点击图片显示大图

    效果: 目录结构: 代码: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="De ...

  3. 【js】【图片显示】js控制html页面显示图片方式

    js控制html页面显示图片方式,只需要引入“jquery-1.11.2.min.js” js: /* 引用 <script src="jquery-1.11.2.min.js&quo ...

  4. Android 开发 Fresco框架点击小图显示全屏大图实现 ZoomableDraweeView

    目标需求 实现一张小图片,被点击后变成一个在整个屏幕上显示的大图片.类似于微信朋友圈的图片. 实现流程 1.Fresco基本初始化 2.下载并且导入ZoomableDraweeView 它是实现大图的 ...

  5. js鼠标滑动图片显示隐藏效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. js点击什么显示什么的内容，隐藏其它和进度条

    点击什么显示什么的内容 <div style="width:200px; height:40px"> <div class="yiji" st ...

  7. js点击图片查看大图，并可以拖动，且滚动滑轮放大缩小

    方法一:此方法在页面没有滚动条时无法缩放 JQuery function hideMax(){ $(".MAX_div").remove(); $("#Cover_Div ...

  8. vue 点击图片显示大图

    使用指南:https://www.npmjs.com/package/vue-directive-image-previewer 简单使用: 1.安装vue-directive-image-previ ...

  9. js点击更多显示更多内容效果

    我写了一个简单的分段显示插件,用法很简单:1,把你要分面显示的内容的容器元素增加一个class=showMoreNChildren,并增加一个自定义属性pagesize="8" 这 ...

随机推荐

  1. hdf5 api

    https://www.physics.ohio-state.edu/~wilkins/computing/HDF/hdf5tutorial/index.html

  2. 关于Git的stash命令

    add 添加新文件到 Git 代码仓库的索引中 $ git add filename mv 移动或重命名文件 $ git mv old-filename new-filename rm 从工作目录和 ...

  3. 【并查集】PKU-1182 食物链

    食物链 Description 动物王国中有三类动物A,B,C,这三类动物的食物链构成了有趣的环形.A吃B, B吃C,C吃A. 现有N个动物,以1-N编号.每个动物都是A,B,C中的一种,但是我们并不 ...

  4. [记录]Ubuntu下，使用Shell，简单替换有规律的文件名称

    因工作中需要将Flash转为Html5,并且要有动画效果,我将Flash的组件导出Png序列,然后将Png序列拼接成一张雪碧图(Sprite),名字为在生成雪碧图可以排序,需要改成数字名称. 而名字是 ...

  5. Web前端发展简史

    Web前端发展简史 有人说“前端开发”是IT界最容易被误解的岗位,这不是空穴来风.如果你还认为前端只是从美工那里拿到切图, JS和CSS一番乱炖,难搞的功能就去网上信手拈来,CtrlC + Ctrl ...

  6. gwt-问题解决

    最近在看gwt,写了个demo,但是总是出问题,困扰了好几天,后台也没报错,但就是加载不出来 第一次编译以后是可以的,但是改了代码后就不行了,后台也没报错,google了好长时间也没出来. 于是换了个 ...

  7. glassfish 日志输出配置

    asadmin set-log-levels javax.enterprise.system.tools.deployment=WARNING

  8. 命令行创建AVD

    1.命令行创建AVD android create avd -n myAvd -t 8 -b armeabi-v7a -p d:\scard.img -s HVGA 2.删除AVD android d ...

  9. 区分.net、c#、asp.net三者间的关系

    1..net(dot net) .net是一个平台,抽象的平台概念. 实现形式是库:①定义了基本的类型(通用类型系统CTS,common type system).   ②包含.net公共语言运行库( ...

  10. win10 删除资源管理器中的6个文件夹

    细心的朋友会发现,在Win10此电脑(计算机)中,除了我们最熟悉的磁盘外,还新增了视频.图片.文档.下载.音乐.桌面这6个文件夹.不少网友举觉得这6个文件夹其实并没什么用,想要去除删掉.那么Win10 ...