<?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>S i X h E a D { ? } &#187; center</title>
	<atom:link href="http://sixhead.com/tag/center/feed/" rel="self" type="application/rss+xml" />
	<link>http://sixhead.com</link>
	<description>เมื่อความรู้มีไว้แบ่งปัน</description>
	<lastBuildDate>Sun, 25 Dec 2011 04:15: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>submit form ให้ขึ้นเป็น popup และอยู่กลางจอ</title>
		<link>http://sixhead.com/2008/02/28/form-submit-to-center-popup/</link>
		<comments>http://sixhead.com/2008/02/28/form-submit-to-center-popup/#comments</comments>
		<pubDate>Wed, 27 Feb 2008 17:28:36 +0000</pubDate>
		<dc:creator>Pipo</dc:creator>
				<category><![CDATA[Developer]]></category>
		<category><![CDATA[center]]></category>
		<category><![CDATA[form]]></category>
		<category><![CDATA[popup]]></category>
		<category><![CDATA[submit]]></category>

		<guid isPermaLink="false">http://sixhead.com/2008/02/28/form-submit-to-center-popup/</guid>
		<description><![CDATA[อาจจะมีความจำเป็นในบางงาน ที่จะต้องมีการ submit form ให้ขึ้นเป็นหน้าใหม่ ยกตัวอย่างเช่น การ submit form ไปเรียก php, aspx ข้าม domain หรือคนละ server ซึ่งการกดปุ่ม submit แล้วขึ้นเป็น windows ใหม่เลยมันก็ดูแสนจะธรรมดา แถมยังอาจจะดูไม่ค่อยดีเท่าไหร่ แต่ถ้าทำให้เป็น popup น่าจะดีกว่า เพราะจำกัดการแสดงผลได้ และผู้ใช้จะปิด popup ได้ง่ายกว่า ผมว่าถ้าจะทำอะไรแล้วต้องทำให้ดีที่สุด นอกจากจะเป็น popup แล้วก็ยังต้องการให้อยู่กลางจอด้วยเพื่อความสวยงาม มาดูตัวอย่างกันครับ function submitPopup &#40;objForm,W,H,S&#41; &#123; // W = width, H = height, S = scrollbar var winleft = &#40;screen.width - W&#41; / [...]]]></description>
			<content:encoded><![CDATA[<p>อาจจะมีความจำเป็นในบางงาน ที่จะต้องมีการ submit form ให้ขึ้นเป็นหน้าใหม่ ยกตัวอย่างเช่น การ submit form ไปเรียก php, aspx ข้าม domain หรือคนละ server ซึ่งการกดปุ่ม submit แล้วขึ้นเป็น windows ใหม่เลยมันก็ดูแสนจะธรรมดา แถมยังอาจจะดูไม่ค่อยดีเท่าไหร่</p>
<p><span id="more-29"></span>แต่ถ้าทำให้เป็น popup น่าจะดีกว่า เพราะจำกัดการแสดงผลได้ และผู้ใช้จะปิด popup ได้ง่ายกว่า ผมว่าถ้าจะทำอะไรแล้วต้องทำให้ดีที่สุด นอกจากจะเป็น popup แล้วก็ยังต้องการให้อยู่กลางจอด้วยเพื่อความสวยงาม มาดูตัวอย่างกันครับ</p>
<pre class="javascript"><span style="color: #003366; font-weight: bold;">function</span> submitPopup <span style="color: #66cc66;">&#40;</span>objForm,W,H,S<span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span>
	<span style="color: #009900; font-style: italic;">// W = width, H = height, S = scrollbar</span>
	<span style="color: #003366; font-weight: bold;">var</span> winleft	=	<span style="color: #66cc66;">&#40;</span>screen.<span style="color: #006600;">width</span> - W<span style="color: #66cc66;">&#41;</span> / <span style="color: #CC0000;">2</span>;
	<span style="color: #003366; font-weight: bold;">var</span> winup	=	<span style="color: #66cc66;">&#40;</span>screen.<span style="color: #006600;">height</span> - H<span style="color: #66cc66;">&#41;</span> / <span style="color: #CC0000;">2</span>;
	winProp		=	<span style="color: #3366CC;">'width='</span>+W+<span style="color: #3366CC;">',height='</span>+H+<span style="color: #3366CC;">',left='</span>+winleft+<span style="color: #3366CC;">',top='</span>+winup+<span style="color: #3366CC;">',scrollbars='</span>+S+<span style="color: #3366CC;">',resizable'</span> + <span style="color: #3366CC;">',status=yes'</span>
&nbsp;
	objForm.<span style="color: #006600;">target</span> = <span style="color: #3366CC;">&quot;newPopup&quot;</span>;
	window.<span style="color: #000066;">open</span><span style="color: #66cc66;">&#40;</span><span style="color: #3366CC;">''</span>, <span style="color: #3366CC;">&quot;newPopup&quot;</span>, winProp<span style="color: #66cc66;">&#41;</span>;
	objForm.<span style="color: #006600;">submit</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre>
<p>ตัว function javascript ด้านบน ทำงานดังนี้<br />
1. คำนวณตำแหน่งกลางจอ<br />
2. ทำการสร้าง popup ขึ้นมามีชื่อว่า newPopup<br />
3. สั่ง submit form</p>
<pre class="html4strict">&nbsp;
<span style="color: #009900;"><a href="http://december.com/html/4/element/form.html"><span style="color: #000000; font-weight: bold;">&lt;form</span></a> <span style="color: #000066;">action</span>=<span style="color: #ff0000;">&quot;/path/to/script.php&quot;</span> <span style="color: #000066;">method</span>=<span style="color: #ff0000;">&quot;post&quot;</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;frmTest&quot;</span> <span style="color: #000066;">id</span>=<span style="color: #ff0000;">&quot;frmTest&quot;</span> <span style="color: #000066;">target</span>=<span style="color: #ff0000;">&quot;newPopup&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
<span style="color: #009900;"><a href="http://december.com/html/4/element/input.html"><span style="color: #000000; font-weight: bold;">&lt;input</span></a> <span style="color: #000066;">type</span>=<span style="color: #ff0000;">&quot;text&quot;</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">&quot;test&quot;</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;test&quot;</span> <span style="color: #000066;">id</span>=<span style="color: #ff0000;">&quot;test&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
<span style="color: #009900;"><a href="http://december.com/html/4/element/input.html"><span style="color: #000000; font-weight: bold;">&lt;input</span></a> <span style="color: #000066;">type</span>=<span style="color: #ff0000;">&quot;button&quot;</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">&quot;Submit&quot;</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;Submit&quot;</span> <span style="color: #000066;">id</span>=<span style="color: #ff0000;">&quot;Submit&quot;</span> <span style="color: #000066;">onClick</span>=<span style="color: #ff0000;">&quot;submitPopup(document.frmTest,300,400,'no');&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
<span style="color: #009900;"><a href="http://december.com/html/4/element/a.html"><span style="color: #000000; font-weight: bold;">&lt;a</span></a> <span style="color: #000066;">href</span>=<span style="color: #ff0000;">&quot;javascript:submitPopup(document.frmTest,300,400,'no');&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>Submit<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/a&gt;</span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/form&gt;</span></span>
&nbsp;</pre>
<p>คำสั่ง html ทำงานดังนี้<br />
1. เมื่อกดปุ่ม Submit หรือ click link ที่คำว่า Submit จะไปเรียก function submitPopup() ของ javascript ให้ทำงานโดยส่ง parameter ไป 4 ตัว<br />
2. จุดสังเกตุคือ target="newPopup" ใน tag form จะชื่อเดียวกับ popup ที่สร้างใหม่จาก javascript นั่นเอง เพราะถ้าเราใส่ชื่อ target ที่ไม่มีอยู่จริงมันจะเด้งเป็นหน้าใหม่ แต่ว่าตัว javascript ไปดักสร้าง popup ชื่อว่า newPopup ไว้ทำให้ form ถูก submit ไปยัง popup ดังกล่าวนั่นเอง</p>
<p><map name='google_ad_map_29_f21c57aff87a446f'>
<area shape='rect' href='http://imageads.googleadservices.com/pagead/imgclick/29?pos=0' coords='1,2,367,28' />
<area shape='rect' href='http://services.google.com/feedback/abg' coords='384,10,453,23'/></map>
<img usemap='#google_ad_map_29_f21c57aff87a446f' border='0' src='http://imageads.googleadservices.com/pagead/ads?format=468x30_aff_img&amp;client=&amp;channel=&amp;output=png&amp;cuid=29&amp;url= http%3A%2F%2Fsixhead.com%2F2008%2F02%2F28%2Fform-submit-to-center-popup%2F' /></p>]]></content:encoded>
			<wfw:commentRss>http://sixhead.com/2008/02/28/form-submit-to-center-popup/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>div กับหน้าจอ กว้าง x ยาว เท่าไหร่ก็อยู่กลางหน้า</title>
		<link>http://sixhead.com/2008/02/13/css-div-center-screen/</link>
		<comments>http://sixhead.com/2008/02/13/css-div-center-screen/#comments</comments>
		<pubDate>Tue, 12 Feb 2008 18:00:48 +0000</pubDate>
		<dc:creator>Pipo</dc:creator>
				<category><![CDATA[Developer]]></category>
		<category><![CDATA[center]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[div]]></category>

		<guid isPermaLink="false">http://sixhead.com/2008/02/13/css-div-center-screen/</guid>
		<description><![CDATA[Code ของคุณ ท่่านอื่นๆ ง่ายกว่าครับ ขอบคุณมา​ ณ ที่นี้ด้วย scroll ลงไปดูล่างๆ]]></description>
			<content:encoded><![CDATA[<p>Code ของคุณ ท่่านอื่นๆ ง่ายกว่าครับ ขอบคุณมา​ ณ ที่นี้ด้วย</p>
<p>scroll ลงไปดูล่างๆ</p>
<p><map name='google_ad_map_21_f21c57aff87a446f'>
<area shape='rect' href='http://imageads.googleadservices.com/pagead/imgclick/21?pos=0' coords='1,2,367,28' />
<area shape='rect' href='http://services.google.com/feedback/abg' coords='384,10,453,23'/></map>
<img usemap='#google_ad_map_21_f21c57aff87a446f' border='0' src='http://imageads.googleadservices.com/pagead/ads?format=468x30_aff_img&amp;client=&amp;channel=&amp;output=png&amp;cuid=21&amp;url= http%3A%2F%2Fsixhead.com%2F2008%2F02%2F13%2Fcss-div-center-screen%2F' /></p>]]></content:encoded>
			<wfw:commentRss>http://sixhead.com/2008/02/13/css-div-center-screen/feed/</wfw:commentRss>
		<slash:comments>15</slash:comments>
		</item>
	</channel>
</rss>

