|
 |
| |
เรื่องของ onmousemove ครับ ผมอยากจะให้เวลาวางเมาส์ที่รูปอะครับแล้วให้รูปมันมีขนาดใหญ่ขึ้นอะครับ |
| |
 |
|
|
 |
 |
|
Code (PHP)
<script type="text/javascript">
function expand_img(Obj)
{
Obj.style.width = "100px";
Obj.style.height= "100px";
}
</script>
<img src="image1.jpg" onmouseover="expand_img(this)" />
ลองดูนะครับ แก้ขนาดในสคริปเลยครับ
|
 |
 |
 |
 |
| Date :
2010-03-30 20:28:48 |
By :
kenessar |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
ขอบคุณที่ให้คำแนะนำครับ
ขอรบกวนเพิ่มอีกนิดนึงครับ ผมอยากให้รูปมันรอยขึ้นมาอยู่บนรูปอะครับ ถ้าทำแบบที่ให้มาเวลารูปมันขยายตัวหนังสือมันก็จะขยับออกไปอะครับ ไม่ทราบว่าต้องทำแบบไหนได้บ้างอะครับ แบบ www.dittoparts.com รูปตรงข้างล่าง best seller อะครับตรงรูปอะครับเวลาวางแล้วรูปมันจะอยู่บนตัวอักษรอะครับ รบกวนด้วยนะครับ
|
| |
|
|
| |
| Date :
2010-03-31 09:10:48 |
By :
joeyonibaku |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ขอคำแนะนำหน่อยนะครับ
|
| |
|
|
| |
| Date :
2010-03-31 23:23:17 |
By :
joeyonibaku |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ใช้คำสั่งพวก gd ครับ แล้วแทรกลายน้ำไว้บนรูป และมันน่าจะทำลายน้ำไว้ตั้งแต่ตอนอัพโหลดละครับ
ส่วนตอนเอาเม้าชี้แล้วมีรูปใหญ่โผล่มา เป็นจาว่าสคริปครับ แต่ถ้าจะให้ง่าย ก็หาปลั๊กอินของ jQuery ในเว็บ www.jquery.org ครับ
|
| |
|
|
| |
| Date :
2010-03-31 23:38:23 |
By :
kenessar |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
หลักการมันคือ มี <div> ลอยอยู่ แล้วข้างในมีแท็ก <img> เวลาเอาเม้าชี้รูปก็เอารูปใหญ่ไปใส่ใน <img> แล้ว ก็แสดง <div> พอเอาเม้าส์ออกก็ซ่อน
วันนี้ไม่มีเวลาละอ่ะครับ ถ้ายังรอไหว พรุ่งนี้จะมาโพสให้ครับ
|
| |
|
|
| |
| Date :
2010-03-31 23:40:37 |
By :
kenessar |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ขอบคุณมากๆนะครับ เดียวผมลองพยายามทำก่อนครับ ยังไงถ้ามีเวลาเข้ามาโพสช่วยโพสหน่อยนะครับ
ขอบคุณอีกครั้งครับ
|
| |
|
|
| |
| Date :
2010-04-01 08:51:29 |
By :
joeyonibaku |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
เอาแค่เรื่องการเอาตัวอักษรวางบนรูปก่อนนะครับ ให้สร้างไฟล์ image.php นะครับ
image.php
<?php
header("Content-type: image/jpeg");
require_once("include/dbconfig.php");
$product_id = (($_GET['id'] != NULL)?$_GET['id']:0);
$sql = "SELECT filepath FROM product WHERE product_id = {$product_id}";
$result = mysql_query($sql);
$row = mysql_fetch_assoc($result);
$filename = $row['filepath'];
$imgoriginal = @imagecreatefromjpeg($filename);
if($imgoriginal === FALSE)
{
$img = imagecreatetruecolor(300 , 300);
$bgcolor = imagecolorallocate($img, 255 , 255 ,255);
$fgcolor = imagecolorallocatealpha($img, 0 , 0 , 0 , 64);
imagefilledrectangle($img , 0 , 0 ,300 , 300 , $bgcolor);
imagestring($img , 8 , 40 , 140 , "Error, Can't load image." , $fgcolor);
}
else
{
$img = @imagecreatetruecolor(300 , 300);
imagecopy($img , $imgoriginal , 0 , 0 , 0 , 0 , 300 , 300);
$fgcolor = imagecolorallocatealpha($img, 0 , 0 , 0 , 64);
imagestring($img , 8 , 130 , 140 , "MySite.com" , $fgcolor);
}
imagejpeg($img);
imagedestroy($img);
imagedestroy($imgoriginal);
?>
โดยในฐานข้อมูลเรา ในตารางที่เก็บข้อมูลสินค้า ให้เพิ่มอีกคอลัมน์หนึ่ง แล้วก็เก็บพาทที่เก็บรูปไว้นะครับ ผมตั้งว่า filepath
เวลาเรียกใช้ก็ระบุ ไอดีของสินค้าลงไปแบบนี้ครับ
image.php?id=1
ตัวอย่าง
<img src="image.php?id=1" width="150" height="150">
ผมตั้งขนาดไว้ที่ 300 * 300 นะครับ แต่เวลาเอามาแสดง ให้แสดงเป็นรูปขนาด 150 * 150 รูปเล็กนั่นเอง
เดี๋ยวต่อไปค่อยมาดูการเอารูปใหญ่ออกมา
|
| |
|
|
| |
| Date :
2010-04-01 10:20:01 |
By :
kenessar |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ถ้าเป็นแบบธรรมดาอะครับจะสามารถทำได้ไหมอย่างเช่นว่า ผมเอาเมาส์ไปวางแล้วเวลารูปขยายรูปแบบเวปไม่เปลี่ยนอะครับ โดยไม่ต้องอิงกับตัว database อะครับ
|
| |
|
|
| |
| Date :
2010-04-01 10:59:58 |
By :
joeyonibaku |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
Code (PHP)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Image Popup Tutorial</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
var hoverstate = false;
var imgurl = null;
$(".thumbnail").mouseover(function()
{
hoverstate = true;
imgurl = this.src;
$("#popupimg").attr("src" , imgurl);
});
$(".thumbnail").mouseout(function()
{
hoverstate = false;
imgurl = null;
});
$(document).mousemove(function(e)
{
if(hoverstate == true)
{
$("#popupimg").css("display","block")
.css("left",(e.pageX + 20) + "px")
.css("top",(e.pageY + 20) + "px");
}
else
{
$("#popupimg").css("display","none");
}
});
});
</script>
<style type="text/css">
#popupimg { position: absolute;display: none; z-index: 99; width:450px; height:337px; border:#000000 solid 1px; }
.thumbnail { width: 20%; }
</style>
</head>
<body>
<img id="popupimg" />
<img src="http://i123.photobucket.com/albums/o309/limabeanlover/Flowers/daisies.jpg" class="thumbnail" />
</body>
</html>
มันต้องฟิกขนาดรูปนะครับ
|
| |
|
|
| |
| Date :
2010-04-01 12:13:22 |
By :
kenessar |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
อันนี้คือแบบธรรมดาที่ผมถามใช่ไหมครับ
ขอบคุณมากๆนะครับ
|
| |
|
|
| |
| Date :
2010-04-01 12:16:35 |
By :
joeyonibaku |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 03
|
