PHP+Mysql+jQuery implements dynamic display of information_PHP tutorial

There is an article in front of this site that introduces how to publish Weibo comments: PHP+Mysql+jQuery realizes the program to publish Weibo - jQuery. This example will be based on its database structure and dynamically display the published information.

View example: DEMO

">

Shuro 8 minutes ago said:

...

The above HTML structure consists of N .saylist is used to display user comment information. Of course, in this example, PHP will be responsible for generating this XHTML code.
CSS



Copy code

The code is as follows:

#demo{width:400px; height:80px; margin:80px auto; border-bottom:1px dotted #d3d3d3}
.saylist{margin:8px auto; height:80px; padding:4px 0;}

.saylist img{float:left; width:50px; margin:4px } .saytxt{float:right; width:320px; overflow:hidden} .saytxt p{line-height:18px} .saytxt p strong{margin-right:6px} . saytxt p span{color:#999}

.say{margin-top:3px; font-size:14px; font-weight:bold}

Renders the HTML appearance using the above CSS, of course You can also customize the appearance you like.
PHP
There are two functions in function.php. formatSay() is used to output the user comment list, that is, to output the HTML above.



Copy code

The code is as follows:


function formatSay($say,$dt,$uid){
$say =htmlspecialchars(stripslashes($say));

return'

height="50" alt="demo" />

demo_'.$uid.' '.tranTime($dt).' Say:

'.$say.'

';
}


The timeline function tranTime() converts the time into a format such as "1 hour ago", details You can read the article on this site: PHP implements timeline function



Copy code

The code is as follows:

function tranTime($stime) {
$rtime = date("m-d H:i",$stime);

$htime = date("H:i",$stime); $day_time = date("j",$ stime); $today=date("j",time()); $ds = $today - $day_time; $time = time() - $stime;

if ( $time < 60) {

$str = 'just';
}
elseif ($time < 60 * 60) {
$min = floor($time/60);
$str = $min.'minutes ago';
}
elseif ($time < 60 * 60 * 24) {
$h = floor($time/(60*60)) ;
$str = $h.'hours ago'.$htime;
if($ds==1)
$str = 'yesterday'.$rtime;
}
elseif ($time < 60 * 60 * 24 * 2) {
$str = 'yesterday'.$rtime;
if($ds==2)
$str = 'the day before yesterday'.$rtime ;
}elseif($time < 60 * 60 * 24 * 3){
$str = 'the day before yesterday'.$rtime;
if($ds>2)
$str = $ rtime;
}
else {
$str = $rtime;
}
return $str;
}


Then in index.php Call funciton.php and connect to the MySQL database to output the comment list.



Copy code

The code is as follows:

require_once('connect.php'); //Connect to the database file
require_once ('function.php'); //Function file

$query=mysql_query("select * from say order by id desc limit 0,15"); while ($row=mysql_fetch_array($query)) { $sayList.=formatSay($row[content],$row[addtime],$row[userid]); }

Output the comment list in div#demo .



Copy code

The code is as follows:

In this way, a list will appear when running index.php. We only need to display them one by one, and jQuery is needed to do the next step.
jQuery

Copy code The code is as follows:

$(function(){
//Except for displaying the first A saylist, others are hidden
$(".saylist").hide().eq(0).show();
//Self-loop function, loop to display information
(function showNextSay (){
//Each message is displayed for 7.5 seconds
$(".saylist:visible").delay(7500).fadeOut("slow",function(){
$(this). appendTo("#demo");
//Show the next item
$(".saylist:first").fadeIn("slow",function(){
//Call the function again
showNextSay();
});
});
})();
});

http://www.bkjia.com/PHPjc/324369.htmlwww.bkjia.comtruehttp: //www.bkjia.com/PHPjc/324369.htmlTechArticleThere is an article in front of this site that introduces how to publish Weibo: PHP+Mysql+jQuery realizes publishing Weibo Blog program - jQuery, this example will be based on its database structure and display the development in a dynamic way...

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn