<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Some reminiscences, some memories &#187; png</title>
	<atom:link href="http://www.mikespook.com/index.php/tag/png/feed" rel="self" type="application/rss+xml" />
	<link>http://www.mikespook.com</link>
	<description>Just another boring day</description>
	<lastBuildDate>Tue, 10 Jan 2012 03:14:06 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>jquery 版的 ie 下 png 图片透明的 js 函数</title>
		<link>http://www.mikespook.com/2008/07/jquery-%e7%89%88%e7%9a%84-ie-%e4%b8%8b-png-%e5%9b%be%e7%89%87%e9%80%8f%e6%98%8e%e7%9a%84-js-%e5%87%bd%e6%95%b0/</link>
		<comments>http://www.mikespook.com/2008/07/jquery-%e7%89%88%e7%9a%84-ie-%e4%b8%8b-png-%e5%9b%be%e7%89%87%e9%80%8f%e6%98%8e%e7%9a%84-js-%e5%87%bd%e6%95%b0/#comments</comments>
		<pubDate>Fri, 04 Jul 2008 02:32:31 +0000</pubDate>
		<dc:creator>mikespook</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[ie]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[png]]></category>
		<category><![CDATA[透明]]></category>

		<guid isPermaLink="false">http://www.mikespook.com/?p=145</guid>
		<description><![CDATA[<style type="text/css">
#leftcontainerBox {
	float:left;
	position: fixed;
	top: 60%;
	left: 70px;
}
#leftcontainerBox .buttons {
	float:left;
	clear:both;
	margin:4px 4px 4px 4px;
	padding-bottom:2px;
}
#bottomcontainerBox {
	width: 50%;
	padding-top: 1px;
}
#bottomcontainerBox .buttons {
	float: left;
	margin: 4px 4px 4px 4px;
}
</style>
1 function correctPNG(objTag) {

 2  // 为 IE 时生效

 3  if(jQuery.browser.msie) {

<span class="readmore"><a href="http://www.mikespook.com/2008/07/jquery-%e7%89%88%e7%9a%84-ie-%e4%b8%8b-png-%e5%9b%be%e7%89%87%e9%80%8f%e6%98%8e%e7%9a%84-js-%e5%87%bd%e6%95%b0/" title="jquery 版的 ie 下 png 图片透明的 js 函数">阅读全文——共1240字</a></span>]]></description>
			<content:encoded><![CDATA[<style type="text/css">
#leftcontainerBox {
	float:left;
	position: fixed;
	top: 60%;
	left: 70px;
}
#leftcontainerBox .buttons {
	float:left;
	clear:both;
	margin:4px 4px 4px 4px;
	padding-bottom:2px;
}
#bottomcontainerBox {
	width: 50%;
	padding-top: 1px;
}
#bottomcontainerBox .buttons {
	float: left;
	margin: 4px 4px 4px 4px;
}
</style>
<blockquote style="background-color:#000000;color: #cccccc;"><p><span style="font-family: monospace;"><span style="color: #ffff00;">1 </span><span style="color: #40ffff;">function</span> correctPNG(objTag) <span style="color: #40ffff;">{</span></span></p>
<p><span style="color: #ffff00;"> 2 </span> <span style="color: #80a0ff;">// 为 IE 时生效</span></p>
<p><span style="color: #ffff00;"> 3 </span> <span style="color: #ffff00;">if</span>(jQuery.browser.msie) <span style="color: #40ffff;">{</span></p>
<p><span style="color: #ffff00;"> 4 </span> $(objTag).each(<span style="color: #40ffff;">function</span>()<span style="color: #40ffff;">{</span></p>
<p><span style="color: #ffff00;"> 5 </span> <span style="color: #40ffff;">var</span> src = $(<span style="color: #40ffff;">this</span>).attr(<span style="color: #ffa0a0;">“src”</span>);</p>
<p><span style="color: #ffff00;"> 6 </span> <span style="color: #80a0ff;">// src 不为空，且为 png 格式图片</span></p>
<p><span style="color: #ffff00;"> 7 </span> <span style="color: #ffff00;">if</span> (src != <span style="color: #ffff00;">undefined</span> &amp;&amp; src.substring(src.length &#8211; 3, src.length).toLowerCase() == <span style="color: #ffa0a0;">“png”</span>) <span style="color: #40ffff;">{</span></p>
<p><span style="color: #ffff00;"> 8 </span> <span style="color: #80a0ff;">// 取出图片原有属性</span></p>
<p><span style="color: #ffff00;"> 9 </span> <span style="color: #40ffff;">var</span> imgId = $(<span style="color: #40ffff;">this</span>).attr(<span style="color: #ffa0a0;">“id”</span>);</p>
<p><span style="color: #ffff00;">10 </span> imgId = imgId == <span style="color: #ffff00;">undefined</span> ? <span style="color: #ffa0a0;">”</span> : imgId;</p>
<p><span style="color: #ffff00;">11 </span> <span style="color: #40ffff;">var</span> imgClass = $(<span style="color: #40ffff;">this</span>).attr(<span style="color: #ffa0a0;">“class”</span>);</p>
<p><span style="color: #ffff00;">12 </span> imgClass = imgClass == <span style="color: #ffff00;">undefined</span> ? <span style="color: #ffa0a0;">”</span> : imgClass;</p>
<p><span style="color: #ffff00;">13 </span> <span style="color: #40ffff;">var</span> imgTitle = $(<span style="color: #40ffff;">this</span>).attr(<span style="color: #ffa0a0;">“title”</span>);</p>
<p><span style="color: #ffff00;">14 </span> imgTitle = imgTitle == <span style="color: #ffff00;">undefined</span> ? <span style="color: #ffa0a0;">”</span> : imgTitle;</p>
<p><span style="color: #ffff00;">15 </span> <span style="color: #40ffff;">var</span> imgStyle = $(<span style="color: #40ffff;">this</span>).attr(<span style="color: #ffa0a0;">“style”</span>);</p>
<p><span style="color: #ffff00;">16 </span> imgStyle = imgStyle == <span style="color: #ffff00;">undefined</span> ? <span style="color: #ffa0a0;">”</span> : imgStyle;</p>
<p><span style="color: #ffff00;">17 </span> imgStyle = <span style="color: #ffa0a0;">“display:inline-block;”</span> + imgStyle;</p>
<p><span style="color: #ffff00;">18 </span> <span style="color: #40ffff;">var</span> imgAlign = $(<span style="color: #40ffff;">this</span>).attr(<span style="color: #ffa0a0;">“align”</span>);</p>
<p><span style="color: #ffff00;">19 </span> <span style="color: #80a0ff;">// 图片对齐属性转为样式</span></p>
<p><span style="color: #ffff00;">20 </span> <span style="color: #ffff00;">switch</span>(imgAlign) <span style="color: #40ffff;">{</span></p>
<p><span style="color: #ffff00;">21 </span> <span style="color: #ffff00;">case</span> <span style="color: #ffa0a0;">“left”</span>:</p>
<p><span style="color: #ffff00;">22 </span> imgStyle = <span style="color: #ffa0a0;">“float:left;”</span> + imgStyle;</p>
<p><span style="color: #ffff00;">23 </span> <span style="color: #ffff00;">break</span>;</p>
<p><span style="color: #ffff00;">24 </span> <span style="color: #ffff00;">case</span> <span style="color: #ffa0a0;">“right”</span>:</p>
<p><span style="color: #ffff00;">25 </span> imgStyle = <span style="color: #ffa0a0;">“float:right;”</span> + imgStyle;</p>
<p><span style="color: #ffff00;">26 </span> <span style="color: #ffff00;">break</span>;</p>
<p><span style="color: #ffff00;">27 </span> <span style="color: #40ffff;">}</span></p>
<p><span style="color: #ffff00;">28 </span> <span style="color: #80a0ff;">// 父标签为 a 时，应用鼠标样式为手指</span></p>
<p><span style="color: #ffff00;">29 </span> <span style="color: #ffff00;">if</span> ($(<span style="color: #40ffff;">this</span>).<span style="color: #ffff00;">parent</span>().get(0).tagName.toLowerCase() == <span style="color: #ffa0a0;">“a”</span>) <span style="color: #40ffff;">{</span></p>
<p><span style="color: #ffff00;">30 </span> imgStyle = <span style="color: #ffa0a0;">“cursor:hand;”</span> + imgStyle;</p>
<p><span style="color: #ffff00;">31 </span> <span style="color: #40ffff;">}</span></p>
<p><span style="color: #ffff00;">32 </span> <span style="color: #80a0ff;">// 设置宽高</span></p>
<p><span style="color: #ffff00;">33 </span> imgStyle = <span style="color: #ffa0a0;">“width:”</span> + $(<span style="color: #40ffff;">this</span>).width() + <span style="color: #ffa0a0;">“px; height:”</span> + $(<span style="color: #40ffff;">this</span>).height() + <span style="color: #ffa0a0;">“px;”</span> + imgStyle;</p>
<p><span style="color: #ffff00;">34 </span> <span style="color: #80a0ff;">// 设置 IE 的 PNG 透明滤镜</span></p>
<p><span style="color: #ffff00;">35 </span> imgStyle = <span style="color: #ffa0a0;">“filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=</span><span style="color: #ffa500;">\”</span><span style="color: #ffa0a0;">“</span> + src + <span style="color: #ffa0a0;">“</span><span style="color: #ffa500;">\”</span><span style="color: #ffa0a0;">,sizingMethod=</span><span style="color: #ffa500;">\”</span><span style="color: #ffa0a0;">scale</span><span style="color: #ffa500;">\”</span><span style="color: #ffa0a0;">);”</span> + imgStyle;</p>
<p><span style="color: #ffff00;">36 </span> <span style="color: #80a0ff;">// 替换 img 标签为 span</span></p>
<p><span style="color: #ffff00;">37 </span> $(<span style="color: #40ffff;">this</span>).replaceWith(<span style="color: #ffa0a0;">“&lt;span id=&#8217;”</span> + imgId + <span style="color: #ffa0a0;">“&#8216; class=&#8217;”</span> + imgClass + <span style="color: #ffa0a0;">“&#8216; title=&#8217;”</span> + imgTitle + <span style="color: #ffa0a0;">“&#8216; style=&#8217;”</span> + imgStyle + <span style="color: #ffa0a0;">“&#8216;&gt;&lt;/span&gt;”</span>);</p>
<p><span style="color: #ffff00;">38 </span> <span style="color: #40ffff;">}</span></p>
<p><span style="color: #ffff00;">39 </span> <span style="color: #40ffff;">}</span>);</p>
<p><span style="color: #ffff00;">40 </span> <span style="color: #40ffff;">}</span></p>
<p><span style="color: #ffff00;">41 </span><span style="color: #ffff00;">} </span></p></blockquote>
]]></content:encoded>
			<wfw:commentRss>http://www.mikespook.com/2008/07/jquery-%e7%89%88%e7%9a%84-ie-%e4%b8%8b-png-%e5%9b%be%e7%89%87%e9%80%8f%e6%98%8e%e7%9a%84-js-%e5%87%bd%e6%95%b0/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

