JavaScript实现网页图片等比例缩放

JavaScript实现网页图片等比例缩放的相关文章

• 
  用CSS等比例缩放图片

  标签：Web开发

  早上起来就在想这个问题，一直到公司也没想出个法，真愁。 对于我这种JS的白痴来说，有点费劲。 试了N久后：width:expression(this.width 100 && this.width this.height ？ 100 : true); height: expression(this.height 100 ？ 100 : true); 支持IE6 FF 和IE7 [ 查看全文 ]

  jin520狮子

  51
• 
  jquery 图片预加载 自动等比例缩放插件

  标签：Web开发

    文件打包下载 代码如下: /* **************图片预加载插件****************** ///作者：没剑(2008-06-23) ///http://regedit.cnblogs.com ///说明：在图片加载前显示一个加载标志，当图片下载完毕后显示图片出来 可对图片进行是否自动缩放功能 此插件使用时可让页面先加载，而图片后加载的方式， 解决了平时使用时要在图片显示出来后才能进行缩放时撑大布局的问题 ///参数设置： scaling...[ 查看全文 ]

  祁浩丶Ta

  261
• 
  妙用javascript实现网页缩放

  标签：Web开发

  现在网页上的字体是越来越小，别说是视力欠佳者就是好眼睛看久了也疼的难受，于是编写了下面这段小脚本，建议网页制作人能够加到网页代码的 head中，以方便弱视人群放大浏览（仅适用于IE浏览器）！代码如下： script language="javascript" var i=0; document.onkeydown = zoom; function zoom(){ var IEKey = event.keyCode; if (IEKey == 76) { i++; document.body.style.zoom=1+i/10; } if (IEK...[ 查看全文 ]

  Amy小兔兔

  01
• 
  图片按比例缩放函数

  标签：Web开发

  以下是程序代码： script language="JavaScript" !-- //图片按比例缩放 var flag=false; function DrawImage(ImgD,iwidth,iheight){     //参数(图片,允许的宽度,允许的高度)     var image=new Image();     image.src=ImgD.src;     if(image.width0 && image.height0){  &nbs...[ 查看全文 ]

  卖女孩的小伙O

  71
• 
  CSS控制图片成比例缩放

  标签：Web开发

  按比例缩小或者放大到某个尺寸，对于标准浏览器（如Firefox），或者最新都IE7浏览器， 直接使用max-width,max-height；或者min-width,min-height的CSS属性即可。如： img{max-width:100px;max-height:100px;} img{min-width:100px;min-height:100px;} 对于IE6及其以下版本的浏览器，则可以利用其支持的expression属性，在css code中嵌入javascript code 来实现图片的缩放 .thumbImage {...[ 查看全文 ]

  bank乐园

  241
• 
  关于图片按比例自适应缩放

  标签：平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计

  今天在看视觉规范的时候，大高走过来说帮他们那边看一个问题。又是一个关于自适应的问题。不过，我喜欢。瞄了一下，需求是这样的：用户上传照片，照片的尺寸未知；需要生成一个预览，这个预览图要根据提供给用户预览的区域自应用，并且居中；如果图片太大，需要按比例缩放。如下图。   瞄了一下，居中可以用 text-align:center; 来实现。而按比例缩放，利用预设 img / 的 width 、height 属性解决...[ 查看全文 ]

  csl9020

  01
• 
  JS图片压缩–图片后加载后按比例缩放

  标签：Web开发

  原理：图片加载完后把图片的尺寸固定在一个固定的范围之内。。 JS Code： script type="text/javascript" var proMaxHeight=100; var proMaxWidth=100; function ImgAuto(ImgD) { var image=new Image(); image.src=ImgD.src; image.onload = function(){ if(image.width0&&image.height0) { var rate=(proMaxWidth/image.widthproMaxHeight/image.height)？proMaxWidth/image.width:proMaxHeig...[ 查看全文 ]

  okscvdsv

  381
• 
  android 大图片拖拽并缩放实现原理

  标签：编程语言 网络编程

  由于最近项目忙，博客一直没有时间更新，今天有点时间就连续更新两篇吧，过过瘾。 这篇图片拖拽缩放也是我在项目中用到的，今天整理一下，将源码奉献给大家，希望对大家以后碰到相似的问题有帮助。 这篇就不做过多介绍了，直接上源码： 代码如下： public class SpacePageActivity extends Activity { private LinearLayout linnerLayout_spacepage; private RelativeLayout relativeLayout_spacepage;...[ 查看全文 ]

  低调奢华的骚年

  411
• 
  Android 图片缩放与旋转的实现详解

  标签：编程语言 网络编程

  本文使用Matrix实现Android实现图片缩放与旋转。示例代码如下： 代码如下： package com.android.matrix; import android.app.Activity; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.graphics.Matrix; import android.graphics.drawable.BitmapDrawable; import android.os.Bundle; import android.view.ViewGroup.LayoutParams; import android.widget.ImageVi...[ 查看全文 ]

  忽然想到01

  381
• 
  js实现图片等比缩略显示 支持IE/FF

  标签：Web开发

  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行][ 查看全文 ]

  wap1hgfz

  1331
• 
  JavaScript 实现ALT标签中显示图片

  标签：Web开发

  html head   script language="javascript" var tipTimer; function locateObject(n, d) { //v3.0 var p,i,x; if(!d) d=document; if((p=n.indexOf("？"))0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&id.forms.length;i++) x=d.forms[i][n];for(i=0;!x&&d.layers&am...[ 查看全文 ]

  逐梦北航

  41
• 
  图片完美缩放

  标签：Web开发

  在公司的工作经常要为客户作产品展示的页面，由于客户上传的图片格式大小不一，缩放后会导致变形，于是在星期天抽了点时间，写了一段JS代码，支持图片的完美缩放。 首先给图片加个div/div标签对，img中不能定义高度或宽度，如下： div class="product_img_div"img src="images/test.jpg" class="product_img" //div 在CSS中写入代码：.product_img_div {width:210px;height:190px;o...[ 查看全文 ]

  炀三郎

  221
• 
  photoshop如何实现缩放效果

  标签：PS教程 PS基础

  很多人都会用到Photoshop的图层样式，但却很少有人会用到图层样式的缩放效果。使用Photoshop图层样式中的“缩放效果”命令，可以同时缩放图层样式中的各种效果，而不会缩放应用了图层样式的对象。 当对一个图层应用了多种图层样式时，“缩放效果”则更能发挥其独特的作用。由于“缩放效果”是对这些图层样式同时起作用，能够省去单独调整每一种图层样式的麻烦。 “缩放效果”命令隐藏在...[ 查看全文 ]

  老子不依

  4821
• 
  iOS应用开发中使用UIScrollView控件来实现图片缩放

  标签：编程语言 网络编程

  一、知识点简单介绍 1.UIScrollView控件是什么？ （1）移动设备的屏幕⼤大⼩小是极其有限的,因此直接展⽰示在⽤用户眼前的内容也相当有限 （2）当展⽰示的内容较多,超出⼀一个屏幕时,⽤用户可通过滚动⼿手势来查看屏幕以外的内容 （3）普通的UIView不具备滚动功能,不能显⽰示过多的内容 （4）UIScrollView是一个能够滚动的视图控件,可以...[ 查看全文 ]

  半夜想你怎么办

  71
• 
  封装的一些实现图片水印与图片自动结合缩放的类

  标签：Web开发

    1using System;   2using System.Data;   3using System.Configuration;   4using System.Web;   5using System.Web.Security;   6using System.Web.UI;   7using System.Web.UI.WebControls;   8using System.Web.UI.WebControls.WebParts;   9using System.Web.UI.HtmlControls;  10using System.Drawing; ...[ 查看全文 ]

  大财主张总

  51
• 
  用JavaScript与WebService实现网页部分数据XML传送

  标签：Web开发

  B/S结构的程序每执行一个操作往往都需要刷新页面，在刷新过程中，服务器不但要将数据发送到客户端，还需要将一些格式信息，比如说表格、图片、标题等重新发送，占用了大量带宽。尽管IE提供了页面缓存的功能，但对于时刻发生变化的动态网页，本地缓存基本上不起什么作用。如果能够让Web服务器只传送关键数据，不传送格式就可以减少带宽占用。当然，在我的系统开发过程中，使用了智能卡进行关键数据加、解...[ 查看全文 ]

  voca1790

  551
• 
  onmousewheel event 缩放图片效果

  标签：Web开发

  onMouseWheel Event Sample－www.51windows.Net onmousewheel event This sample uses the onmousewheel event to expand or contract the picture below. Move the cursor over the picture and roll the mouse wheel up and down. Size = 100% http://msdn.microsoft.com/workshop/samples/author/dhtml/refs/onmousewheelEX.htm. [ 查看全文 ]

  清纯的心乐园

  261
• 
  中文的版用JavaScript实现超酷的“网页时钟”

  标签：Web开发

  只须将如下的javascript代码插入到你页面html的head区即可！ SCRIPT language=JavaScript !-- dCol='yellow'; //定义日历颜色 fCol='#ff0000'; //定义1-12这12个数的颜色 sCol='#00ff00'; //定义秒针颜色 mCol='#0000ff'; //定义分针颜色 hCol='#ff0000'; //定义时针颜色 ClockHeight=40; //定义时钟的高度 ClockWidth=40; //定义时钟的宽度 ClockFromMouseY=0; //定义时钟的中心距鼠标的相对垂直距离 Clock...[ 查看全文 ]

  18kueen

  41
• 
  用javascript实现的仿Flash广告图片轮换效果

  标签：Web开发

  !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" html xmlns="http://www.w3.org/1999/xhtml" head meta http-equiv="Content-Type" content="text/html; charset=gb2312" / title仿Flash广告图片轮换效果--来自/title /head style type="text/css" !--...[ 查看全文 ]

  心兰007

  581
• 
  JavaScript实现Iterator模式

  标签：Web开发

  在网上看到有不少JS设计模式的示例。 今天参照： http://www.cnblogs.com/iloveu/archive/2009/03/31/1426234.html 写了一下，记录在此，仅作备忘： !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" html xmlns="http://www.w3.org/1999/xhtml" head meta content="text/html; charset=utf-8" http-equiv="...[ 查看全文 ]

  领着对象见网友

  21