TECH & TIPS

 ใส่เพลง MP3 ในหน้าเว็บเพจ ด้วย XML MP3 PLAYER

  วิธีการทำ
  1. ให้ Download ไฟล์ Sourcecode
  2. ให้ใส่ URL ของเพลง MP3 ใน XML File ที่ชื่อ playlist.xml ครับ (อาจใช้โปรแกรม Notepad เปิดขึ้นมาแก้)



  3. นำ Code ด้านล่างไปไว้ในตำแหน่งที่ต้องการให้แสดงกล่องเล่นเพลงครับ ใน <body> (ดูตัวอย่างในไฟล์ demo.html)
1.               <!-- ไฟล์หน้าเว็บเพจใส่กล่องเล่นเพลง จะต้องมีไฟล์ playlist.xml อยู่ระดับเดียวกัน -->  
2.               <!-- ด้านล่างให้ระบุตำแหน่งของไฟล์ mp3.swf ให้ถูกต้อง (หลักการเหมือนแทรกรูปภาพธรรมดาๆ) -->  
3.               <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="300" height="120" id="menu" align="middle">  
4.               <param name="allowScriptAccess" value="sameDomain" />  
5.               <param name="movie" value="mp3.swf" />  
6.               <param name="quality" value="high" />  
7.               <param name="allowFullScreen" value="true" />  
8.               <embed src="mp3.swf" quality="high" width="300" height="120" name="menu" align="middle" allowScriptAccess="sameDomain" allowFullScreen="true" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />  
9.               </object>  
<!-- ไฟล์หน้าเว็บเพจใส่กล่องเล่นเพลง จะต้องมีไฟล์ playlist.xml อยู่ระดับเดียวกัน -->
<!-- ด้านล่างให้ระบุตำแหน่งของไฟล์ mp3.swf ให้ถูกต้องด้วยครับ (หลักการเหมือนแทรกรูปภาพธรรมดาๆ) -->
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="300" height="120" id="menu" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="mp3.swf" />
<param name="quality" value="high" />
<param name="allowFullScreen" value="true" />
<embed src="mp3.swf" quality="high" width="300" height="120" name="menu" align="middle" allowScriptAccess="sameDomain" allowFullScreen="true" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
  4. แค่นีก็เสร็จสิ้นแล้ว สามารถใช้งานได้เลย




อีเมล์การสมัครสมาชิกรูปแบบของแถบการแจ้งเตือน







การโชว์รูปให้เป็นแบบ Slide Show โดยใช้ javascript

ขั้นแรกเราต้องไปโหลด ไฟล์ .js ที่ชื่อว่า jquery มาก่อน โดยในตัวอย่างนี้จะใช้ jquery-1-4-2.min.js
และในไฟล์ของเราจะเขียนฟังก์ชั่นดังนี้
<script type=”text/javascript”>
var position = 1; // ตำแหน่งของรูปเริ่มต้นว่าจะให้รูปแรกโชว์รูปที่เท่าไร
var count = 3; //จำนวนรูปทั้งหมดที่จะให้โชว์(โชว์ทีละรูปแต่กดเลื่อนไปมา)
function slide_banner(dir) // dir จะเป็นตัวกำหนดว่าเลื่อนไปทางซ้ายหรือขวา( +1 ขวา, -1 ซ้าย)
{
position += dir;
if(position == 0){
position = count;
}
if(position == count+1){
position = 1;
}
$(’#frame’).stop().animate({marginLeft:-(615*(position-1))+’px’}, 1000); //frame คือ id ของ div ที่ครอบรูปทั้งหมดไว้โดยเลข 615 นั่นคือความกว้างของ div ที่มีรูปหนึ่งรูปนั่นเอง(div ที่อยู่ใน div ที่ครอปรูปทั้งหมด) และเลข 1000 คือเวลาที่ใช้ในการทำ animation จนเสร็จ(ms)
}
</script>
และในไฟล์ .css ของเราจะเป็น
.frame{
height: 76px;
width: 300%; //จำนวน % จะคิดจากจำนวนรูปทั้งหมด x100 ซึ่งในตัวอย่างคือ 3 รูป
}
.frame .image{
height: 76px;
width: 615px;
float: left;
}


พยากรณ์อากาศสำหรับเว็บ

กรมอุตุนิยมวิทยาจัดทำ หน้าแสดงผลการพยากรณ์อากาศรายจังหวัดแบบคร่าว ๆ โดยออกแบบมาให้มีขนาดเล็ก เพื่อให้เหมาะกับการนำไปวางในหน้าเว็บเพจของผู้ให้บริการเว็บไซต์ ได้อย่างสะดวก มีให้เลือกใช้ 2 แบบ ดังนี้
แบบมาตรฐาน 

แสดงข้อมูลพยากรณ์อากาศในจังหวัดหลัก ๆ ของแต่ละภูมิภาค


โค้ด
<iframe src="http://www.tmd.go.th/daily_forecast_forweb.php" width="180" height="260" scrolling="no" frameborder="0"></iframe>
Control Form 
สามารถเลือกแสดงผลการพยากรณ์รายจังหวัดที่ต้องการได้ตามความสนใจ



โค้ด
<iframe src="http://www.tmd.go.th/daily_forecast_forweb.php?strProvinceID=2-77-78-69-55-37-23" width="180" height="260" scrolling="no" frameborder="0"></iframe>





ไม่มีความคิดเห็น:

แสดงความคิดเห็น