random image บน header ใน exteen

posted on 21 Feb 2008 12:42 by robocon  in Programing

** ก่อนอื่นถ้าหน้า Page มัน ดู แปลกๆไปก็ Ctrl+F5 กันไปตามระเบียบก็แล้วกัน **

เป็นอะไรไม่รู้ชอบมาเปลี่ยนธีม ช่วงตอนจะสอบตลอดเลยฮ่าๆ...

ความจริงก็คิดไว้ตั้งนานแล้วล่ะครับว่า จะลองใช้ ดู เพราะเคยเข้าไปดูในบล็อค

ของคุณ NERD GOD ไม่แน่่ใจว่าเป็นเจ้าของเดียวกันกับ http://nerd.exteen.com/ ด้วยรึป่าว

อยากเห็นต้นฉบับ ก็ คลิกตาม link นี้เลยจ้า

แล้วสังเกตุเห็นว่า ภาพตรง head เข้าเปลี่ยนเองได้ด้วย

เวลาเรา Refresh หน้าใหม่ ก็เลยแอบเข้าไปดูใน Styles sheet เลยรู้ว่า

มันใช้ php ได้ด้วยแหะ....แต่เนื่องจากไป view source ดูแล้วปรากฏว่า

มันอ่านเป็นภาษาต่างดาว ก็เลยไปหา code จาก เว็บ hot script มาแทน

(เว็บ hot script ต้องสมัครเป็นสมาชิกก่อนนะครับ)

ถ้าใครขี้เกียจก็ ตาม link นี้เลยจ้าแล้วไปดู code เอาเอง

ส่วนใคร ยัง งง ๆ อยู่ มีวิธีการง่ายๆ คือ ก็อป code นี้ไปซะ

<?php
// Change the folder name to your one in the line below
$folder = "images";
srand( time() );
if ($directory = @opendir($folder)) {
while (($image = readdir($directory)) !== false) {
if ( eregi( '.(jpg|gif)$', $image ) ) { $images[] = $image; }
}
closedir($directory);
}
$image = $images[rand() % sizeof( $images )];
if ( eregi( '.jpg$', $image ) ) {
header( "Content-Type: image/jpeg" );
} else {
header( "Content-Type: image/gif" );
}
header( "Content-Length: " . filesize( $folder."/".$image ) );
readfile( $folder."/".$image );
?>

แล้วก็ save เป็นชื่ออะไรก็ได้ตามที่เราต้องการ ที่เป็นนามสกุล .php

ต่อมาก็สร้างโฟล์เดอร์ที่มีชื่อว่า images ขึ้นมา แล้วก็หาภาพที่เราต้องการยัดใส่เข้าไปในโฟล์เดอร์นั้น

ส่วนไฟล์ php ที่เราสร้างขึ้นมาอยู่นอกโฟล์เดอร์นะครับ

Edit ณ วันที่29/12/51 โฮสต์ภาพมันได้หายไปแล้ว....กาก

ตัวอย่างดังภาพ ไฟล์ php ผม ตั้งชื่อไว้ว่า randomimage.php ส่วนใน โฟล์เดอร์ images ผมก็ใส่ภาพเอาไว้

** ส่วนถ้าใครใช้ชื่อโฟล์เดอร์อื่น ก็เข้าไปเปลี่ยน ใน php บรรทัด $folder = "images"; ก็เปลี่ยนจาก

images เป็นชื่อตามที่เราต้องการนะครับ

ทดสอบก่อนส่งขึ้น host จริงด้วยล่ะครับ เพื่อความชัวร์

ส่วนการประยุกต์ใช้ใน exteen ก็โคตรง่ายเลยครับคือเอามาใส่ในส่วนที่เราต้องการให้เป็น background

อย่างเช่น

#coverimage{
margin-top:32px;
background:url(http://your domainname/your folder/randomimage.php) no-repeat;
height:300px;
width:730px;
}

ดังตัวอย่างผมใช้ในส่วนของภาพ header นะครับ ถ้าลอง F5 จะเห็นว่าสีมันเปลี่ยนไป

แต่ช่วงแรกๆภาพอาจจะโหลดช้านะครับสำหรับคนที่เน็ตช้าๆอย่างผม

เสร็จแล้วครับกับการ random ภาพที่นำมาประยุกต์ใช้ใน exteen ก็นำไป apply กันเอาเองเด้อครับ

สำหรับวันนี้ สวัสดีคร๊าบ

ใครที่ยังสอบไม่เสร็จ หรือว่ากำหลังสอบ ก็ขอให้ตั้งใจอ่านหนังสือมากๆนะครับ

โชค A+++ กันทุกๆคนนะครับ

บ๋ายบาย ~~~~~

เขียนแทรกเข้ามาใหม่ ณ วัน ที่ 29/12/51 เวลา15.01น.

long.rar <<< ไอ่ตัวนี้ผมได้อัพโหลดขึ้นไปไว้ใน FileFactory นะครับ เป็นเคสตัวอย่าง

วิธีโหลด ตามภาพเลยนะครับ ผมไม่ขออธิบายอะไรมากแล้ว

พอโหลดมาแล้วก็ทำการแตก rar เลยครับ แล้วจับ Folder ที่ชื่อว่า long ยัดเข้าไปใน localhost เลย

เสร็จแล้วให้เข้า localhost ตามปกติเลยครับเพื่อดูผลงาน

ตัวอย่างนะครับ ในเครื่องของผมเอง http://localhost/long/

 

หรือถ้าเราเข้าไปดูใน Folder จะเห็นเป็นดังภาพเลยครับ

stepการทำงานมันก็จะเริ่มจาก ในตัว index ก่อนใช่มั้ยล่ะครับ

แล้วใน file index ก่อน body เราก็แทรกตัว css เข้าไป

ก็จะเป็นการให้ไฟล์ css ทำงานร่วมกับ index

จากนั้นในตัว body ตอนถึง div id="coverimage" ก็คือเราเรียกใช้งาน id นั้นๆ

มันก็จะวิ่งไปหาตัว coverimage ซึ่ง เราตั้ง backgroudไว้เป็นไฟล์ php

มันก็เลยวิ่งไปหาตัว ไฟล์ php ที่เราได้เขียนเอาไว้เอามาใช้งานเป็น Background

 

หวังว่าคงจะไม่งง นะครับ

 

ปล. อีกหนึ่งเรื่องคือ ในไฟล์ style.css นั้นตรง coverimage ถ้าเรียกใช้พาธตามปกติไม่ออก

ให้ใส่พาธเต็มไปเลยครับ

อย่างเช่น http://localhost/long/codeimg.php เป็นต้น

Comment



smilebig smileopen-mounthed smileconfused smilesad smileangry smiletonguequestionembarrassedsurprised smilewinkdouble winkcry

Tweet

อ๊ะ ผมสอบเสร็จพอดี...

เรื่อง Random Image น่าสนใจมากครับ ^^ ขอบคุณนะครับผม พอดีรูปในคลังมีเยอะ...

#1 By on 2008-02-21 13:50

อ๊ะ ผมสอบเสร็จพอดี...

เรื่อง Random Image น่าสนใจมากครับ ^^ ขอบคุณนะครับผม พอดีรูปในคลังมีเยอะ...

#2 By on 2008-02-21 14:03

ขอบคุณครับ ได้ความรู้ใหม่ๆconfused smile

#3 By เอกน้อย on 2008-02-21 16:32

confused smile อ้อออ อย่างนี้นี่เอง !!! sad smile

#4 By * BanaNee on 2008-02-21 16:33

ปัญหาคือ ไม่มีโฮสให้อีพ php อ่ะครับ sad smile

#5 By DarkZeusPDS on 2008-02-21 21:45

ถูกแล้วครับ ต้องขอบคุณคุณ Book >>>คนเดียวกะ
NerdGod

ส่วนโฮสนั้นผมมี host ดีๆ 8iy[

www.th.gs อ่ะ

#6 By หูใหญ่ on 2008-02-22 02:51

ดูท่าจะยากอ่า T_T
แต่ก็ขอบคุณนะคะ อิอิ double wink
เก่งแหะ

#7 By r a p p e l e r * on 2008-02-23 01:23

ต้องลองครับต้องลองไม่ยากเกินความสามารถ confused smile

#8 By robocon on 2008-02-24 02:40

ทำไมทำไม่ได้อ่ะค่ะ...

#9 By Riko~Y on 2008-12-28 11:08

โอยยย....ทำแล้ว ทำอีก...

ข้ามปีแป้งก้อยังทำไม่ได้ค่ะ...

ลองเอา php อัพลงโฮสก้อแล้ว

ยังไม่ได้อีกอ่ะค่ะ...

แป้งต้องทำยังไงคะ

ฮือออ

#10 By Riko~Y on 2009-03-13 20:31

เค้าว่าจะทำซะหน่อยอ่ะค่ะ อยากได้แบบนี้เหมือนกัน
แต่มันยากตรงเอาโค๊ดไปใส่หรือไม่ก้อัพลงโฮสนี่ล่ะค่ะ
เลยถอดใจไปเลย

#11 By *-kaorukomi-* on 2009-10-01 18:24