【JS获取图片的原始宽度和高度，兼容IE7,8】的更多相关文章

JS获取图片的原始宽度和高度

页面中的img元素,想要获取它的原始尺寸,以宽度为例,可能首先想到的是元素的innerWidth属性,或者jQuery中的width()方法.如下: <img id="img" src="1.jpg">   <script type="text/javascript">     var img = document.getElementById("img");     console.log(img.i…

JS获取图片的原始宽度和高度，兼容IE7,8

naturalWidth和naturalHeight 可以直接获取img的原始宽高,而innerHight,innerWith只是获取图片所占容器盒子的宽高. // 封装function getNaturalSize (DomElement) { var natureSize = {}; if(window.naturalWidth && window.naturalHeight) { natureSize.width = DomElement.naturalWidth; natureSi…

js和jquery如何获取图片真实的宽度和高度

按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式,下面为大家介绍下js和jquery如何获取图片真实的宽度和高度   1.什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都是按照图片的原尺寸来展示,如果手机屏幕太小,太大的图就会超出去!这时候有两种解决办法 1)给所有的图片加上这样的样式 .news img{margin…

js和jquery获取图片真实的宽度和高度

1.什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都是按照图片的原尺寸来展示,如果手机屏幕太小,太大的图就会超出去!这时候有两种解决办法 1)给所有的图片加上这样的样式 1.news img{margin:5px auto; display:block;width:100%; height:auto;}但是这种方式有另外一个问题就是,如果插入的图…

如何通过js和jquery获取图片真实的宽度和高度

什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都是按照图片的原尺寸来展示,如果手机屏幕太小,太大的图就会超出去!这时候有两种解决办法 1.给所有的图片加上这样的样式 .news img{margin:5px auto; display:block;width:100%; height:auto;} 但是这种方式有另外一个问题就是,如果插入的图片本…

js获取图片的原始尺寸

<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript" src="Packages/jQuery.1…

Javascript获取图片原始宽度和高度的方法详解

前言 网上关于利用Javascript获取图片原始宽度和高度的方法有很多,本文将再次给大家谈谈这个问题,或许会对一些人能有所帮助. 方法详解 页面中的img元素,想要获取它的原始尺寸,以宽度为例,可能首先想到的是元素的innerWidth属性,或者jQuery中的width()方法. <img id="img" src="1.jpg"> <script type="text/javascript"> var img = d…

Js获取图片原始宽高

如果我们页面看到的图片都是缩略图,那就需要做个图片点击放大效果,那么怎样获取图片的原始宽高呢?方法如下: //获取图片原始宽度 function getNaturalWidthAndHeight(img) { var image = new Image(); image.src = img.src; return [image.width,image.height]; } //点击缩略图弹出层,显示原始图片. //获取class为tz_main_box下的所有p标签下的图片img $(".tz_…

js获取图片信息（一）-----获取图片的原始尺寸

如何获取图片的原始尺寸大小? 如下,当给 img 设置一个固定的大小时,要怎样获取图片的原始尺寸呢? #oImg{ width: 100px; height: 100px; } <img src="images/test.jpg" id="oImg" alt=""> 方法一: HTML5提供了一个新属性 naturalWidth / naturalHeight 可以直接获取图片的原始宽高.这两个属性在Firefox/Chrome/Sa…

【记录】JS 获取图片原始尺寸－防止图片溢出

示例代码: <div id="div_content"> <img src="http://static.cnblogs.com/images/logo_small.gif" alt="Alternate Text" /> </div> <script type="text/javascript"> $(document).ready(function () { var myim…