javascript+div+css¹ö¶¯²Ëµ¥µÄʵÏÖ.
Ч¹ûͼ
´úÂë:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Scrollable</title>
<mce:script type="text/javascript"><!--
resizeCallback = function() {
var containerStyle = document.getElementById('scrollable_container').style;
var containerNewWidth = document.body.clientWidth - 32;
containerStyle.width = containerNewWidth + 'px';
document.getElementById('scrollable_content').style.left = '0px';
}
window.onresize = resizeCallback;
var scroll = false;
function scrollToRight(speed, ele) {
var container = ele.nextSibling;
var content = container.firstChild;
var containerLeft = container.offsetLeft - 16;
var contentLeft = content.offsetLeft;
var minus_result = containerLeft - contentLeft;
speed = minus_result > speed ? speed : (minus_result > 0 ? minus_result : 0);
if(scroll && minus_result > 0) {
content.style.left = contentLeft + speed;
setTimeout(function(){scrollToRight(speed, ele)}, 50);
}
}
function scrollToLeft(speed, ele) {
var container = ele.previousSibling;
var content = container.firstChild;
var containerRight = container.offsetWidth;
var contentRight = content.offsetLeft + content.offsetWidth;
var minus_result = contentRight - containerRight;
speed = minus_result > speed ? speed : (minus_result > 0 ? minus_result : 0);
if(scroll && minus_result > 0) {
content.style.left = content.offsetLeft - speed;
setTimeout(function(){scrollToLeft(speed, ele)}, 50);
}
}
var contentWidth = 0;
// --></mce:script>
<mce:style type="text/css"><!--
body{background: #778899;}
.author-information{background: #BBBBBB; width: 500px; height: 150px; text-align: left; padding: 0 5px; }
.author-information-lab
Ïà¹ØÎĵµ£º
1. jQuery tablesorter
http://tablesorter.com/docs/
2. Table sorting with Prototype
http://tetlaw.id.au/view/blog/table-sorting-with-prototype/
3. Sorttable
http://www.kryogenix.org/code/browser/sorttable/
4. Table Sorting Javascript
http://yoast.com/articles/sortable-table/
5. Sorting Tabl ......
6¡¢»ùÓÚ¶ÔÏóµÄJavaScriptÓïÑÔ
JavaScriptÊÇ»ùÓÚ¶ÔÏóµÄµÄÓïÑÔ£¬²»ÏñÃæÏò¶ÔÏóÓгéÏ󡢼̳С¢ÖØÔصÈÓйØÃæÏò¶ÔÏóµÄ¹¦ÄÜ£¬µ«ÊÇËü»¹ÊǾßÓÐÃæÏò¶ÔÏóµÄ»ù±¾ÌØÕ÷£¬Ëü¿ÉÒÔ¸ù¾ÝÐèÒª´´½¨×Ô¼ºµÄ¶ÔÏ󣬴Ӷø½øÒ»²½À©´óJavaScriptµÄÓ¦Ó÷¶Î§£¬ÔöÇ¿±àд¹¦ÄÜÇ¿´óµÄWebÎĵµ¡£
¶ÔÏóµÄ»ù´¡ÖªÊ¶£º
¶ÔÏóÊÇÓÉÊôÐԺͷ½·¨Á½¸ö»ù±¾ÔªËØ×é³É¡£Ò»¸ö¶Ô ......
<!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>js³ýÈ¥×Ö·û´®¿Õ¸ñ ......
ÓÐÐí¶àСÇÏÃÅÀ´Ê¹±à³Ì¸ü¼ÓÈÝÒס£ÆäÖÐÖ®Ò»¾ÍÊÇeval()º¯Êý£¬Õâ¸öº¯Êý¿ÉÒÔ°ÑÒ»¸ö×Ö·û´®µ±×÷Ò»¸öJavaScript±í´ïʽһÑùÈ¥Ö´ÐÐËü¡£ÒÔÏÂÊÇËüµÄ˵Ã÷
Eval º¯Êý
¹¦ÄÜ£ºÏȽâÊÍJavascript´úÂ룬ȻºóÔÚÖ´ÐÐËü
Ó÷¨£ºEval(codeString)
codeStringÊǰüº¬ÓÐJavascriptÓï¾äµÄ×Ö·û´®£¬ÔÚevalÖ®ºóʹÓÃJavascriptÒýÇæ±àÒë¡£
¾Ù¸öСÀý×Ó£º
......
ÔÚ¹úÄÚÍøÕ¾ÖУ¬°üÀ¨Èý´óÃÅ»§£¬ÒÔ¼°“ÒýÁì”ÖйúÍøÕ¾Éè¼Æ³±Á÷µÄÀ¶É«ÀíÏ룬ChinaUIµÈ¶¼ÊÇʹÓÃÁËpx×÷Ϊ×ÖÌ嵥λ¡£Ö»ÓаٶȺôõ×öÁ˸ö¿Éµ÷µÄ±íÂÊ¡£¶øÔÚ´óÑó±Ë°¶£¬¼¸ºõËùÓеÄÖ÷Á÷Õ¾µã¶¼Ê¹ÓÃem×÷Ϊ×ÖÌ嵥룬Ҳ¾ÍÊǿɵ÷µÄ¡£Ã»´í£¬px±Èem¸ü¼ÓÈÝÒ×ʹÓ㬴󲿷ֶÁÕß²»ÖªµÀemΪºÎÎï»òÕßËüÏ൱ÓÚ¶àÉÙpx¡£¹úÍâÈËÊ¿Èç´ËÖØÊÓÍøÕ ......