drupal: ทดลองทำบล๊อกแสดงภาพ
Submitted by wd on Fri, 2006-12-15 11:33
ทดลองทำบล๊อกแสดงภาพแบบสุ่ม
จากความรู้ครั้งก่อน
web: แสดงรูปแบบสุ่ม
web: แสดงรูปแบบสุ่ม - revised
web: ปรับปรุงแสดงภาพแบบจางหาย
ลองนำมาประยุกต์ทำบล๊อกให้ drupal
อธิบายมากไม่ได้ เพราะรู้น้อยและเริ่มลืมแล้ว แสดงโค๊ดเลยดีกว่า
เข้าเมนูของ drupal
Administer -> Site building -> Blocks
{TAB} Add block
Block desciption: Random image
Block title: Random image
Block body:
<?php
// RETURN RANDOM IMAGE FROM DIRECTORY
// CODE FROM http://www.javascriptkit.com/javatutors/externalphp2.shtml
// Header("content-type: application/x-javascript");
function get_random_image($dirname=".") {
// ***** CHANGE SOURCE OF IMAGE HERE
$dirname="/var/www/www.thaitux.info/drupal/files/themes";
// ***** URL OF IMAGE
$url="http://www.thaitux.info/files/themes";
$pattern="(\.jpg$)|(\.png$)|(\.jpeg$)|(\.gif$)"; //valid image extensions
$filelists = array();
$curimage=0;
if($handle = opendir($dirname)) {
while(false !== ($file = readdir($handle))) {
if(eregi($pattern, $file)) { //if this file is a valid image
$filelists[] = $file;
$curimage++;
}
}
closedir($handle);
}
$random_keys = array_rand($filelists);
print $url."/".$filelists[$random_keys];
return ($filelists);
}
?>
<script LANGUAGE="JavaScript">
<!-- BEGIN PROCEDURE
function rotateImage(place) {
// wd's IMPLEMENT FROM FADING
var imageId = 'blendimage';
var image = document.getElementById(imageId);
var speed = Math.round(1500 / 100);
dFadeIn(imageId, speed);
}
function dFadeIn(imageId, speed) {
for (timer = 0; timer <= 100; timer++) {
setTimeout("changeOpac(" + timer + ",'" + imageId + "')",(timer * speed))
}
}
// CHANGE THE OPACITY FOR DIFFERENT BROWSERS
function changeOpac(opacity, id) {
var object = document.getElementById(id);
opacity = (opacity == 100)?99.99:opacity;
// New Firefox
object.style.opacity = (opacity / 100);
// Mozilla & Firefox
object.style.MozOpacity = (opacity / 100);
// Safari, Konqueror
object.style.KhtmlOpacity = (opacity/100) ;
// IE/Win
object.style.filter = "alpha(opacity:" + opacity + ")";
}
// END PROCEDURE -->
rotateImage('rImage');
</script>
<div id="random_image"><center>
<img name="rImage" src="<?php get_random_image() ?>" alt="Random image gallery" title="Random image gallery" id="blendimage" width="150px">
</center></div>Input format: PHP code
-> Save block
แสดงไว้ทางบล๊อกด้านขวา ใต้ Link







Recent comments