|
 |
| |
แทรก code php ดึงข้อมูงจาก MySql ตัวหนังสือมา ตัวเดียว (jquery slideshow) |
| |
 |
|
|
 |
 |
|
คือผม โหลด jquery slideshow มาครับแล้ว จะให้ ข้อความใน slide ดึงออกมาจาก Mysql แทน ไม่ต้องมานั่งพิมพ์
โดยใน slide มี 4 หัวข้อ ผมเลยใช้คำสั่งดึงข้อมูลจาก Sql มา 4 หัวข้อแล้วมาเก็บไวใน array ด
ลองทดสอบ run ดู ออกมาไม่มีปัญหา แต่พอเอาไปแทรกใน หน้า index แทรก code <?=$title_blof[0]?> ลงใน code ของ jqurey
ตัวหนังสือ ออกมาก แค่ตัวแรกอะครับ(เช่น Soure จะออกมาแค่ S )
- code ก่อนนำไปแทรก
[li][/li]
Code (PHP)
<?
$host = "localhost";
$user = "root";
$pw = "1234";
$dbname = "db_blog";
$c = mysql_connect($host, $user, $pw);
if(!$c){
echo "cannot connect to database" ;
exit();
}
if(!isset($start)){
$start = 0;
}
$limit = "3";
$sql = "select * from tb_blog order by id_blog desc limit $start,$limit";
$result = mysql_db_query($dbname, $sql);
$i = 0;
while($r = mysql_fetch_array($result)){
$id_blog[$i] = $r['id_blog'];
$title_blog[$i] = $r['title_blog'];
$i++;
}
echo "$title_blog[0]";
?>
เมื่อเอาไปแทรก index.php
* ช่วงบรรทัด 81 - 82 ที่มีปัญหาครับ
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>Untitled Document</title>
<link href="slider/style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js" ></script>
<script type="text/javascript">
$(document).ready(function(){
$("#featured").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
$("#featured").hover(
function() {
$("#featured").tabs("rotate",0,true);
},
function() {
$("#featured").tabs("rotate",5000,true);
}
);
});
</script>
</head>
<body>
<?
$user = "root";
$pw = "1234";
$dbname = "db_blog";
$c = mysql_connect($host, $user, $pw);
if(!$c){
echo "cannot connect to database" ;
exit();
}
if(!isset($start)){
$start = 0;
}
$limit = "3";
$sql = "select * from tb_blog order by id_blog desc limit $start,$limit";
$result = mysql_db_query($dbname, $sql);
$i = 0;
while($r = mysql_fetch_array($result)){
$id_blog[$i] = $r['id_blog'];
$title_blog[$i] = $r['title_blog'];
$i++;
}
echo "$title_blog[0]"; // ลอง echo ดู ประโยคมาครบครับ
?>
<div id="container">
<div id="top">
<h1>Header</h1>
</div>
<div id="menu">
<? include "menu.php"; ?>
</div>
<div id="leftnav">
<div id="recent_cover_all">
<div id="recent_cover">
<div id="recent_topic">
Recent update
</div>
</div>
</div>
<? include "blog_recent.php"; ?>
</div>
<div id="content">
<div id="blog">
<div id="slide">
<div id="featured" >
<ul class="ui-tabs-nav">
<li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-1"><a href="#fragment-1"><img src="images/image1-small.jpg" alt="" /><span><? print substr($title_blog[0], 0, 25); ?></span></a></li> // บรรทัดนี้ แทรก code แล้วข้อความออกมา 1 ตัว
<li class="ui-tabs-nav-item" id="nav-fragment-2"><a href="#fragment-2"><img src="images/image2-small.jpg" alt="" /><span><?=$title_blog[0]?></span></a></li> // บรรทัดนี้ แทรก code แล้วข้อความออกมา 1 ตัว (ไม่ใช้ substr)
<li class="ui-tabs-nav-item" id="nav-fragment-3"><a href="#fragment-3"><img src="images/image3-small.jpg" alt="" /><span>35 Amazing Logo Designs</span></a></li>
<li class="ui-tabs-nav-item" id="nav-fragment-4"><a href="#fragment-4"><img src="images/image4-small.jpg" alt="" /><span>Create a Vintage Photograph in Photoshop</span></a></li>
</ul>
<!-- First Content -->
<div id="fragment-1" class="ui-tabs-panel" style="">
<img src="images/image1.jpg" alt="" />
<div class="info" >
<h2><a href="#" ><?=$title_blog[0]?></a></h2>
<p><? print substr($title_blog[0], 0, 25); ?>...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla tincidunt condimentum lacus. Pellentesque ut diam....<a href="#" >read more</a></p>
</div>
</div>
<!-- Second Content -->
<div id="fragment-2" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image2.jpg" alt="" />
<div class="info" >
<h2><a href="#" >20 Beautiful Long Exposure Photographs</a></h2>
<p>Vestibulum leo quam, accumsan nec porttitor a, euismod ac tortor. Sed ipsum lorem, sagittis non egestas id, suscipit....<a href="#" >read more</a></p>
</div>
</div>
<!-- Third Content -->
<div id="fragment-3" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image3.jpg" alt="" />
<div class="info" >
<h2><a href="#" >35 Amazing Logo Designs</a></h2>
<p>liquam erat volutpat. Proin id volutpat nisi. Nulla facilisi. Curabitur facilisis sollicitudin ornare....<a href="#" >read more</a></p>
</div>
</div>
<!-- Fourth Content -->
<div id="fragment-4" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image4.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Create a Vintage Photograph in Photoshop</a></h2>
<p>Quisque sed orci ut lacus viverra interdum ornare sed est. Donec porta, erat eu pretium luctus, leo augue sodales....<a href="#" >read more</a></p>
</div>
</div>
</div>
</div>
<br />
<? include "blog_show.php"; ?>
</div>
</div>
<div id="footer">
Footer</div>
</div>
</body>
</html>
ออกมาเป็นแบบนี้ครับ
**ประโยค จริงๆ คือ Apple Store celebrates 10th anniversary with 2.0 experience, iPads locked in Lucite แต่มาแค่ S ครับ
Tag : PHP, MySQL, JavaScript, jQuery, CakePHP
|
ประวัติการแก้ไข
2011-05-25 13:10:07
2011-05-25 13:12:22
2011-05-25 13:14:51
|
 |
 |
 |
 |
| Date :
2011-05-25 13:08:38 |
By :
golfdestiny |
View :
1398 |
Reply :
5 |
|
 |
 |
 |
 |
|
|
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
แทรกแบบนี้ข้างบนมันจะได้ค่าสุดท้ายจาก loop while น่ะครับ
ลองแบบนี้ดู
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>Untitled Document</title>
<link href="slider/style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js" ></script>
<script type="text/javascript">
$(document).ready(function(){
$("#featured").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
$("#featured").hover(
function() {
$("#featured").tabs("rotate",0,true);
},
function() {
$("#featured").tabs("rotate",5000,true);
}
);
});
</script>
</head>
<body>
<?
$user = "root";
$pw = "1234";
$dbname = "db_blog";
$c = mysql_connect($host, $user, $pw);
if(!$c){
echo "cannot connect to database" ;
exit();
}
if(!isset($start)){
$start = 0;
}
$limit = "3";
$sql = "select * from tb_blog order by id_blog desc limit $start,$limit";
$result = mysql_db_query($dbname, $sql);
$i = 0;
echo "$title_blog[0]"; // ลอง echo ดู ประโยคมาครบครับ
?>
<div id="container">
<div id="top">
<h1>Header</h1>
</div>
<div id="menu">
<? include "menu.php"; ?>
</div>
<div id="leftnav">
<div id="recent_cover_all">
<div id="recent_cover">
<div id="recent_topic">
Recent update
</div>
</div>
</div>
<? include "blog_recent.php"; ?>
</div>
<div id="content">
<div id="blog">
<div id="slide">
<div id="featured" >
<ul class="ui-tabs-nav">
<?
while($r = mysql_fetch_array($result))
{
$id_blog[$i] = $r['id_blog'];
$title_blog[$i] = $r['title_blog'];
?>
<li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-1"><a href="#fragment-1"><img src="images/image1-small.jpg" alt="" /><span><? print substr($title_blog[$i], 0, 25); ?></span></a></li> // มันจะแสดงทุก record ตามเงื่อนไข Query ครับ
<?
$i++;
}
?>
</ul>
<!-- First Content -->
<div id="fragment-1" class="ui-tabs-panel" style="">
<img src="images/image1.jpg" alt="" />
<div class="info" >
<h2><a href="#" ><?=$title_blog[0]?></a></h2>
<p><? print substr($title_blog[0], 0, 25); ?>...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla tincidunt condimentum lacus. Pellentesque ut diam....<a href="#" >read more</a></p>
</div>
</div>
<!-- Second Content -->
<div id="fragment-2" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image2.jpg" alt="" />
<div class="info" >
<h2><a href="#" >20 Beautiful Long Exposure Photographs</a></h2>
<p>Vestibulum leo quam, accumsan nec porttitor a, euismod ac tortor. Sed ipsum lorem, sagittis non egestas id, suscipit....<a href="#" >read more</a></p>
</div>
</div>
<!-- Third Content -->
<div id="fragment-3" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image3.jpg" alt="" />
<div class="info" >
<h2><a href="#" >35 Amazing Logo Designs</a></h2>
<p>liquam erat volutpat. Proin id volutpat nisi. Nulla facilisi. Curabitur facilisis sollicitudin ornare....<a href="#" >read more</a></p>
</div>
</div>
<!-- Fourth Content -->
<div id="fragment-4" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image4.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Create a Vintage Photograph in Photoshop</a></h2>
<p>Quisque sed orci ut lacus viverra interdum ornare sed est. Donec porta, erat eu pretium luctus, leo augue sodales....<a href="#" >read more</a></p>
</div>
</div>
</div>
</div>
<br />
<? include "blog_show.php"; ?>
</div>
</div>
<div id="footer">
Footer</div>
</div>
</body>
</html>
|
ประวัติการแก้ไข
2011-05-25 15:06:13
| |
|
|
| |
| Date :
2011-05-25 15:05:27 |
By :
mangkunzo |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
มันแสดงออกมาเป็นแบบนี้ครับ ด้านขวาหายไปเลยครับ
จากอันเดิม
|
ประวัติการแก้ไข
2011-05-25 15:39:07
| |
|
|
| |
| Date :
2011-05-25 15:31:52 |
By :
golfdestiny |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
เป็นเหมือนเดิมครับ
แต่ผมลองเอาไป แทรกที่อื่นดูแล้วสามรถวน loop ได้แต่ถ้าเอาไปแทรกที่เดิม เป็นออกมาในลักษณะเดิมครับ
|
| |
|
|
| |
| Date :
2011-05-28 17:57:41 |
By :
golfdestiny |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 04
|
