核心代碼：
$(function() { $(".dvcontent img").each(function() { var maxwidth = 520; if ($(this).width() > maxwidth) { var oldwidth = $(this).width(); var oldheight = $(this).height(); var newheight = maxwidth/oldwidth*oldheight; $(this).css({width:maxwidth+"px",height:newheight+"px",cursor:"pointer"}); $(this).attr("title","點(diǎn)擊查看原圖"); $(this).click(function(){window.open($(this).attr("src"))}); } }); }); 如果上面的代碼不能執(zhí)行，可以使用下面的代碼：
$(window).load(function() { $(".dvcontent img").each(function() { var maxwidth = 600; if ($(this).width() > maxwidth) { var oldwidth = $(this).width(); var oldheight = $(this).height(); var newheight = maxwidth/oldwidth*oldheight; $(this).css({width:maxwidth+"px",height:newheight+"px",cursor:"pointer"}); $(this).attr("title","點(diǎn)擊查看原圖"); $(this).click(function(){window.open($(this).attr("src"))}); } }); });通過(guò)css還有一種方法兼容IE6能讓圖片在超過(guò)規(guī)定的寬度時(shí)自動(dòng)按比例縮小，但該寫法不符合W3C標(biāo)準(zhǔn)。代碼如下：
.cate img{ max-width: 600px; height:auto; width:expression(this.width > 600 ? "600px" : this.width); }所以在做到盡量兼容IE和其他瀏覽器以及符合W3C的標(biāo)準(zhǔn)下就通過(guò)js來(lái)控制圖片的寬度了，下面使用jquery控制圖片顯示時(shí)的最大寬度，主代碼如下：
$(window).load(function() { $(".cate img").each(function() { var maxwidth = 600; if ($(this).width() > maxwidth) { $(this).width(maxwidth); } });});代碼很簡(jiǎn)單，就是cate樣式下的所以img的最大寬度只能為600px。.each(function(){......})，each在這里是對(duì)指定的圖片集合對(duì)象逐一調(diào)用下面的方法。這種jquery方法在IE6及以上瀏覽器和chrome及Firefox上都能實(shí)現(xiàn)控制圖片顯示時(shí)的最大寬度。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注
