<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. linux系统安装(虚拟机以及linux的下载与安装)

    最近开始研究linux系统,以前接触linux系统只是一些简单的命令,例如: pwd:查看当前目录   ls:遍历目录    cd :在目录之间切换等. linux系统是基于unix系统开发的,是一个 ...

  2. big data vs HPC

    When I tried some SIMD optimization in large-scale simulation(HPC), it is so difficult to implment. ...

  3. Service的一些使用

    service服务一般主要是作为后台服务使用的,前台服务一般结合通知一起. service一般主要用作长期后台服务的,而且和Activity结合性不那么紧密, 一般如果需要频繁的更新UI主要是用Act ...

  4. poj1274 匈牙利算法 二分图最大匹配

    poj1274 题意: 有n个奶牛, m个畜舍, 每个畜舍最多装1头牛,每只奶牛只有在自己喜欢的畜舍里才能产奶. 求最大产奶量. 分析: 其实题意很明显, 二分图的最大匹配, 匈牙利算法. #incl ...

  5. cookie管理中的一些细节，转的

    1.domain表示的是cookie所在的域,默认为请求的地址,如网址为www.jb51.net/test/test.aspx,那么domain默认为www.jb51.net.而跨域访问,如域A为t1 ...

  6. Web开发知识点总结

    前言:这是一篇简单的web开发知识点的总结,适用于刚开始学习编程的人来学习的.我是为了能够在熟记熟记这些知识点而总结的一篇文章. 1       什么是浏览器? (1) 浏览器就是接收浏览者的操作(打 ...

  7. JAVA操作LDAP总结

    一.LDAP概念 LDAP的全称为Lightweight Directory Access Protocol(轻量级目录访问协议), 基于X.500标准, 支持 TCP/IP. LDAP目录为数据库, ...

  8. springmvc(六)——视图和视图解析器

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAoIAAAGrCAIAAADb2WEhAAAgAElEQVR4nOzdaVhTd78vfF8/z772c9 ...

  9. 暑假集训(2)第四弹 ----- 敌兵布阵（hdu1166)

    D - 敌兵布阵 Crawling in process... Crawling failed Time Limit:1000MS     Memory Limit:32768KB     64bit ...

  10. HowTo: SVN undo add without reverting local changes

    Reference: http://stackoverflow.com/questions/5083242/undo-svn-add-without-reverting-local-edits svn ...