jQuery点缩略图显示大图片
2015年繁忙的一月份,无更多时间去学习ASP.NET MVC程序,二月份又是中国的新年,长达半个月的假期,望回到老家中,在无电脑无网络的日子里,能有更多时间陪伴年迈的父母亲。
今天学习jQuery的相关知识,应用到图片上,用户点一点图片,放大显示图片功能。
创建一个控制器FebY15Controller:
接下来创建视图Index:
标记1,添加图片样式:
标记2,添加htm代码,原片显示以及放大图片的占位div标签:
标记3,引用jQuery类库。
标记4,编写jQuery程序:
下面是动态演示:
本篇中,可以学到jQuery的click事件。使用标签.样式类获取对象(img.thumb)。使用$(this)来代码对象本身。.attr("scr")获取图片src图片路径。还有一个就是.animate()动态事件。
jQuery点缩略图显示大图片的更多相关文章
- android高仿微信UI点击头像显示大图片效果
用过微信的朋友朋友都见过微信中点击对方头像显示会加载大图,先贴两张图片说明下: 这种UI效果对用户的体验不错,今天突然有了灵感,试着去实现,结果就出来了.. 下面说说我的思路: 1.点击图片时跳转到另 ...
- 一天JavaScript示例-点击图片显示大图片添加鼠标
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- jQuery弹出美女大图片
效果:http://hovertree.com/texiao/jqimg/2/ 效果图: 下载:http://hovertree.com/h/bjaf/jdaqepet.htm HTML代码: < ...
- Android 显示大图片
主要的代码如下: BitmapFactory.Options options = new BitmapFactory.Options(); //图片解析配置 options.inJustDecodeB ...
- android高仿微信UI点击头像显示大图片效果, Android 使用ContentProvider扫描手机中的图片,仿微信显示本地图片效果
http://www.cnblogs.com/Jaylong/archive/2012/09/27/androidUI.html http://blog.csdn.net/xiaanming/arti ...
- Android(java)学习笔记236:多媒体之加载大图片到内存(Bitmap API)
1.Bitmap (API使用) android里面的bitmap中,一个像素点需要4个byte去表示,这是因为android表示颜色是" argb ":其中 a 表示是透明度,然 ...
- Android(java)学习笔记179:多媒体之加载大图片到内存(Bitmap API)
1. Bitmap (API使用) android里面的bitmap中,一个像素点需要4个byte去表示,这是因为android表示颜色是" argb ":其中 a 表示是透明度, ...
- jQuery实现等比例缩放大图片
在布局页面时,有时会遇到大图片将页面容器“撑破”的情况,尤其是加载外链图片(通常是通过采集的外站的图片).那么本文将为您讲述使用jQuery如何按比例缩放大图片,让大图片自适应页面布局. 通常我们 ...
- jQuery实现等比例缩放大图片让大图片自适应页面布局
通常我们处理缩略图是使用后台代码(PHP..net.Java等)根据大图片生成一定尺寸的缩略图,来供前台页面调用,当然也有使用前台javascript脚本将加载后的大图强行缩放,变成所谓的缩略图,这种 ...
随机推荐
- 对于程序开发者看书(指实在的书而不是PDF)的好处。(个人看法而已)
书是实在的东西.不同PDF.他能带你进入一种学习态度的环境 书上已经所列了知识点.看了.那些知识点就是你的. 第一次看,未必完全理解到里面的东西.说不定过几天,几周,几个月,甚至几年.再看.就有可能看 ...
- Java Inner Classes
When thinking about inner classes in java, the first thing that comes to my mind is that, WHY do we ...
- CSS3学习笔记——伪类hover
最近看到一篇文章:“Transition.Transform和Animation使用简介及应用展示” ,想看看里面 “不同缓动类效果demo”例子的效果,发现了一个问题如下: .Trans_Bo ...
- Java 部分排序算法
. import java.io.*;import java.math.*;import java.util.*;public class Algr{ public static int array[ ...
- [原创]自定义view之:快速开发一款Material Design风格的dialog的开源项目MDDialog
随着google开始主导Material Design风格的设计,越来越多的app开始使用Material Design风格来设计自己的UI.虽然在Android Studio中集成了多种快速开发框架 ...
- Spring3系列13-Controller和@RequestMapping
Spring3系列13-Controller和@RequestMapping Controller返回值,String或者ModelAndView @RequestMapping关联url @Requ ...
- Spark1.0新特性-->Spark SQL
Spark1.0出来了,变化还是挺大的,文档比以前齐全了,RDD支持的操作比以前多了一些,Spark on yarn功能我居然跑通了.但是最最重要的就是多了一个Spark SQL的功能,它能对RDD进 ...
- sqlserver 字符串最后一次的位置,截取字符串
--reverse:字符串倒排 SUBSTRING(字段,1,len(字段)- CHARINDEX('-',REVERSE(字段)))
- [转]C++学习–基础篇(书籍推荐及分享)
C++入门 语言技巧,性能优化 底层硬货 STL Boost 设计模式 算法篇 算起来,用C++已经有七八年时间,也有点可以分享的东西: 以下推荐的书籍大多有电子版.对于技术类书籍,电子版并不会带来一 ...
- iOS 7定制UIPageControl遇到的问题
转自snorlax's blog 先说下ios7之前 那些点点的实现非常简单 就是UIPageControl.subviews 就是一个个点的UIImageView 所以只需简单的替换掉就好了代码如下 ...