TalkPHP

TalkPHP (http://www.talkphp.com/forums.php)
-   MySQL & Databases (http://www.talkphp.com/mysql-databases/)
-   -   Help me for Fade in/Out in Dynamic Table. (http://www.talkphp.com/mysql-databases/5048-help-me-fade-out-dynamic-table.html)

deden 10-22-2009 12:54 AM

Help me for Fade in/Out in Dynamic Table.
 
Hello,

I am Deden from Indonesia. New in PHP.
I have a problem. I have data in Mysql. I need it can run with fade in/out.
I hope, I am not wrong post this thread to MySql and Database Thread because need Jquery.

===========
Here is the script :

?>
<div align="center"></div>
<table border="1" bordercolor="#0000FF" bgcolor="#FFFF00">
<tr>
<td class="style10"><div align="center" class="style9 style11 style29">NOMOR</div></td>
<td class="style10"><div align="center" class="style12 style29">NOMOR SURAT </div></td>
<td class="style10"><div align="center" class="style16 style29">NAMA/INSTANSI</div></td>
<td class="style10"><div align="center" class="style30">ALAMAT</div></td>
<td class="style10"><div align="center" class="style30">JENIS PELAYANAN </div></td>
<td class="style10"><div align="center" class="style30">STATUS</div></td>
</tr>
<?php do { ?>
<tr>
<td class="style10"><div align="center" class="style33"><?php echo $row_Recordset1['nm']; ?></div></td>
<td class="style33"><?php echo $row_Recordset1['nosrt']; ?></td>
<td class="style17"><span class="style32"><?php echo $row_Recordset1['nama']; ?></span></td>
<td class="style10"><span class="style33"><?php echo $row_Recordset1['alamat']; ?></span></td>
<td class="style10"><div align="center" class="style18 style21"><?php echo $row_Recordset1['jenis']; ?></div></td>
<td class="style10"><div align="center" class="style32 style55"><?php echo $row_Recordset1['status']; ?></div></td>
</tr>
<?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>
</table>
<p>&nbsp;</p>
</body>
</html>
<?php
mysql_free_result($Recordset1);
?>

==========

I want it like this :

===========

<!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=ISO-8859-1" />
<title>News Ticker with jQuery</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){

var first = 0;
var speed = 700;
var pause = 3500;

function removeFirst(){
first = $('ul#listticker li:first').html();
$('ul#listticker li:first')
.animate({opacity: 0}, speed)
.fadeOut('slow', function() {$(this).remove();});
addLast(first);
}

function addLast(first){
last = '<li style="display:none">'+first+'</li>';
$('ul#listticker').append(last)
$('ul#listticker li:last')
.animate({opacity: 1}, speed)
.fadeIn('slow')
}

interval = setInterval(removeFirst, pause);
});
</script>
<style type="text/css">
body{
font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}
#listticker{
height:200px;
width:400px;
overflow:hidden;
border:solid 1px #DEDEDE;
padding:6px 10px 14px 10px;;
}
#listticker li{
border:0; margin:0; padding:0; list-style:none;
}

#listticker li{
height:60px;
padding:5px;
list-style:none;
}
#listticker a{
color:#000000;
margin-bottom:
}
#listticker .news-title{
display:block;
font-weight:bold;
margin-bottom:4px;
font-size:11px;
}
#listticker .news-text{
display:block;
font-size:11px;
color:#666666;
}
#listticker img{
float:left;
margin-right:14px;
padding:4px;
border:solid 1px #DEDEDE;
}
</style>

</head>

<body>
<ul id="listticker">

<li>
<img src="img/1.png" />
<a href="" class="news-title">Health care reform</a>
<span class="news-text">President Obama has announced three bedrock requirements for real health care reform</span>
</li>
<li>
<img src="img/2.png" />
<a href="" class="news-title">National Geographic Animals</a>

<span class="news-text">Killer whales, Bengal tigers, crocs, more</span>
</li>
<li>
<img src="img/3.png" />
<a href="" class="news-title">Spotlight stars</a>
<span class="news-text">Marilyn Manson is not exactly a conformist. From his music — a meat-grinder...</span>
</li>

<li>
<img src="img/4.png" />
<a href="" class="news-title">Lost: the new serie is coming</a>
<span class="news-text">Watch full episodes online. The final season begins early 2010</span>
</li>
</ul>

<p>
More tutorials on <a href="http://woork.blogspot.com/">Woork.blogspot.com</a></p>

</body>
</html>

==================

Sorry I dont attach the jquery.js and images. Would you like to help me please......

Thanks for your attention.

Deden

adamdecaf 10-22-2009 09:47 PM

What exactly are you trying to do? Grab data from a database every time something is faded in/out?

Edit: 2**8 posts!

deden 10-23-2009 04:08 AM

yes...I want grab data from Mysql and the data move fade out/in on the screen everytime. It's able to do in PHP?

adamdecaf 10-24-2009 03:37 PM

Quote:

Originally Posted by deden (Post 28947)
yes...I want grab data from Mysql and the data move fade out/in on the screen everytime. It's able to do in PHP?

Well, sure it is. Something like this may be of sorts.

javascript Code:
.load("http://domain.tld/path/to/script.php");

deden 10-26-2009 03:18 AM

where i should input there, Adam. I am in localhost. Still confuse


All times are GMT. The time now is 11:51 AM.

Powered by vBulletin® Version 3.6.8
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.1.0