Bài gửi
Tiền
Thanksvi01239984564
![[code]Hiện thông tin cá nhan khi rê chuột vào avatar v2 Empty](https://2img.net/i/empty.gif)
[code]Hiện thông tin cá nhan khi rê chuột vào avatar v2
on 06/12/2014vi01239984564
loading...
Demo: ![[code]Hiện thông tin cá nhan khi rê chuột vào avatar v2 110](https://i.servimg.com/u/f43/17/53/46/78/110.jpg)
Thêm vào CSS:
- Code:
/* drop menu avatar */
.pun .user{overflow:visible;margin-top:0!important;width:13em;padding:0}
.cl dt{width:75px}
.cl dt span{color:#000!important}
.cl dd{width:110px}
.cl dd,.cl dt{float:left;height:1.6em;line-height:1.6em}
.useravatar img{width:120px;background-color:#F5F5F5;border-bottom:2px solid;border-radius:3px;border-right:2px solid;padding:5px}
.morelink a{padding-right:13px}
.pun .post .user,.pun .postfoot{margin-left:-13em!important;position:relative}
.pun .postmain{margin-left:13em!important}
.main .main-head,.main .main-foot{border:3px double}
.closeWIndowF{background-color:transparent;color:red;font-family:Arial,Helvetica,sans-serif;font-variant:small-caps;letter-spacing:-1px;opacity:1;text-decoration:none;text-transform:capitalize;font-size:20px;text-shadow:0 0 9px #eee 3px 0 1px #131313;font-weight:700;padding:5px}
.user .status{padding-right:20px;margin-bottom:-3px;color:green;float:right;width:250px;height:18px}
.user-ident .posthead{background-color:transparent;font-size:9px;height:2.6em;left:-2px;position:absolute;text-align:center;top:-3.7em;width:15.3em;padding:.5em 1.3em .5em 1em}
.user-ident .userInfoF{position:absolute;z-index:301;background:none repeat scroll 0 0 #fff;border:1px solid #cdcdcd;box-shadow:2px 2px 3px #ccc;width:510px;left:-2px;display:none;top:-1px;padding:15px 0 15px 10px}
.user-ident .user-info{float:right;width:370px}
.user-ident .manuUserF{float:left;border-bottom:1px dashed;margin-bottom:5px;width:350px;position:relative}
.user-ident .morelink{text-align: center;float:left;border-top:1px dashed;padding-top:5px;width:350px}
.pun .postfoot .user-contact{float:none;left:-0.7em;position:absolute;text-align:center;width:13em;z-index:99}
#profile-advanced-details .autobot{color:#2220FB!important;font-size:14px!important;text-shadow:1px 1px 1px #000!important}
.loaddingLike{background:url(http://i48.servimg.com/u/f48/16/58/89/73/loadin11.gif) no-repeat scroll center center transparent;display:none;height:1.4em;width:126px;margin:-1.4em 0 -3px 200px}
.FMvi-like em {display:none;}
.post .post-options{height: 22px;position:relative}
.FMvi-like .nolikeplus{float:left}
.FMvi-like .nolikeminus{cursor:pointer;float:left;left:80px;position:absolute;top:5px}
.FMvi-like{min-width: 180px;left:180px;position:absolute;display:none;}
.FMvi-like .likePro,.FMvi-like .likeNone{border-radius:1px 1px 1px 1px;color:#FFF;text-align:left;width:57px;padding:3px 5px}
.FMvi-like .likePro{cursor:pointer!important;background:url(http://i48.servimg.com/u/f48/16/58/89/73/like_b12.png) no-repeat scroll 45px center #31A8FC!important;border:1px solid #2888CC!important}
.FMvi-like .likeNone{cursor:not-allowed;background:url(http://i48.servimg.com/u/f48/16/58/89/73/like_n11.png) no-repeat scroll 45px center #B1B1B1;border:1px solid #919699}
.FMvi-like .likePro:hover{text-shadow:1px 1px 1px #000}
.FMvi-like .nub{display:none;background-image:url(http://i48.servimg.com/u/f48/16/58/89/73/tip10.png);background-position:0 0;background-repeat:no-repeat;float:left;height:8px;margin-left:-55px;margin-top:24px;position:relative;width:13px;z-index:99}
.FMvi-like .commentLike{min-width: 280px;display:none;background-color:#FBFAE6;border:1px solid #A3A3A3;float:left;left:0;top:30px;position:absolute;z-index:30;padding:5px}
.commentLike input{background-color:#FFF;border:1px solid #A3A3A3;display:none;height:28px;width:350px}
.commentLike p{padding:7px 0;text-align:left}
.FMvi-like .closeFMvi_like{background-image:url(http://i48.servimg.com/u/f48/16/58/89/73/tip10.png);background-position:0 -9px;background-repeat:no-repeat;height:16px;right:2px;top:2px;position:absolute;width:15px}
- Code:
<!-- BEGIN postrow -->
Code... Code..Bla..Blap... Blap ... la... lalalala.......
<!-- END postrow -->
</div>
- Code:
<script type="text/javascript">//<![CDATA[var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on = '{JS_MULTIQUOTE_IMG_ON}', _atr = '{JS_DIR}addthis/', _ati = '{PATH_IMG_FA}addthis/'{ADDTHIS_LANG}, addthis_localize = { share_caption: "{L_SHARE_CAPTION}", email: "{L_EMAIL}", email_caption: "{L_EMAIL_CAPTION}", favorites: "{L_SHARE_BOOKMARKS}", print: "{L_PRINT}", more: "{L_MORE}" };$(function(){_atc.cwait = 0;$('.addthis_button').mouseup(function(){if ($('#at15s').css('display') == 'block') {addthis_close();addthis_close();}});});//]]></script><!-- BEGIN switch_user_logged_in --><div id="pun-visit" class="clearfix"><ul><!-- BEGIN switch_plus_menu --><li><script type="text/javascript">//<![CDATA[var url_favourite = '{switch_user_logged_in.U_FAVOURITE_JS_PLUS_MENU}';var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';var url_tellfriend = '{U_TELLFRIEND_JS_PLUS_MENU}';insert_plus_menu_new('f{FORUM_ID}&t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});//]]></script></li><!-- END switch_plus_menu --><li><a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&pub=forumotion">{L_SHARE}</a></li><li><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a></li><li><a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></li><!-- BEGIN watchtopic --><li>{S_WATCH_TOPIC}</li><!-- END watchtopic --></ul><p>{LOGGED_AS}. {LAST_VISIT_DATE}</p></div><!-- END switch_user_logged_in --><!-- BEGIN switch_user_logged_out --><div id="pun-visit"><p>{L_NOT_CONNECTED} {L_LOGIN_REGISTER}</p></div><!-- END switch_user_logged_out --><div class="pun-crumbs noprint"><p class="crumbs"><a href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC} » <strong><a href="{TOPIC_URL}">{TOPIC_TITLE}</a></strong><!-- BEGIN switch_twitter_btn --><span id="twitter_btn" style="margin-left: 6px; "><a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></span><!-- END switch_twitter_btn --><!-- BEGIN switch_fb_likebtn --><span id="fb_likebtn" style="margin-left: 6px; "><iframe src="http://www.facebook.com/plugins/like.php?href={FORUM_URL}{TOPIC_URL}&layout=button_count&show_faces=false&width=450&action=like&colorscheme=light&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:auto; height:21px;" allowTransparency="true"></iframe></span><!-- END switch_fb_likebtn --></p></div><div class="main paged"><div class="paged-head clearfix"><!-- BEGIN topicpagination --><p class="paging">{PAGINATION}</p><!-- END topicpagination --><p class="posting"><!-- BEGIN switch_user_authpost --><a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a> <!-- END switch_user_authpost --><!-- BEGIN switch_user_authreply --><a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /></a><!-- END switch_user_authreply --></p></div>{POLL_DISPLAY}<div class="main-head clearfix"><p class="h2"><a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a> <a href="#bottom">{L_GOTO_DOWN}</a> {L_MESSAGE} [{PAGE_NUMBER}]</p></div><div class="main-content topic"><!-- BEGIN postrow --> <!-- BEGIN displayed --> <div class="post" {postrow.displayed.THANK_BGCOLOR}> <a name="{postrow.displayed.U_POST_ID}"></a> <div class="postmain" {postrow.displayed.THANK_BGCOLOR}> <div id="p{postrow.displayed.U_POST_ID}" class="posthead" {postrow.displayed.THANK_BGCOLOR}> <h2> <a href="?showpost={postrow.displayed.U_POST_ID}"><strong>#{postrow.displayed.COUNT_POSTS}</strong></a>{postrow.displayed.ICON} <a href="{postrow.displayed.POST_URL}">{postrow.displayed.POST_SUBJECT}</a> </h2> </div> <div class="postbody" {postrow.displayed.THANK_BGCOLOR}> <div class="user"> <div class="user-ident" id="userinfo{postrow.displayed.U_POST_ID}" style="position: relative;"> <div class="posthead"> <em>{postrow.displayed.POST_DATE_NEW}</em> </div> <div onmouseover="show_user({postrow.displayed.U_POST_ID})" onmouseout="hide_user({postrow.displayed.U_POST_ID})" class="userInfoF"> <div class="useravatar" style="float: left;">{postrow.displayed.POSTER_AVATAR}</div> <div class="user-info"> <div class="manuUserF"> <strong>{postrow.displayed.POSTER_NAME}</strong> <span class="fmviOnoff">{postrow.displayed.ONLINE_IMG}</span> </div> <dl class="cl" style="float:right; width: 370px;"> <!-- BEGIN profile_field --> <dt>{postrow.displayed.profile_field.LABEL}</dt> <dd>{postrow.displayed.profile_field.CONTENT}</dd> <!-- END profile_field --> </dl> <div> <span style="color:blue">Estado:</span> <marquee class="status"></marquee> </div> <div class="morelink"> <a target="_blank" class="Upro5"><img alt="Phóng vào trang cá nhân" src="http://i48.servimg.com/u/f48/16/58/89/73/profil10.png" />Phóng vào trang cá nhân</a> <a target="_blank" class="Utopic"><img alt="Gửi tin nhắn" src="http://i48.servimg.com/u/f48/16/58/89/73/total_10.gif" />Gửi tin nhắn</a> <a target="_blank" class="Ufrien"><img alt="Kết bạn" src="http://i48.servimg.com/u/f48/16/58/89/73/friend10.png" />Kết bạn</a> </div> </div> </div> <div class="user-basic-info"> <div onmouseover="show_user({postrow.displayed.U_POST_ID})" class="useravatar" style="padding: 15px 0 15px 9px">{postrow.displayed.POSTER_AVATAR}</div> <p class="rankimg" style="padding:11px">{postrow.displayed.RANK_IMAGE}</p> </div> </div> </div> <div class="post-entry"> <div class="entry-content"> <div> <div>{postrow.displayed.MESSAGE}</div> <!-- BEGIN switch_attachments --> <dl class="attachbox"> <dt>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt> <dd> <!-- BEGIN switch_post_attachments --> <dl class="file"> <dt> <img src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" /> <!-- BEGIN switch_dl_att --> <a class="postlink" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a>{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL} <!-- END switch_dl_att --> <!-- BEGIN switch_no_dl_att -->{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL} <!-- END switch_no_dl_att --> </dt> <!-- BEGIN switch_no_comment --> <dd> <em>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</em> </dd> <!-- END switch_no_comment --> <!-- BEGIN switch_no_dl_att --> <dd> <em> <strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong> </em> </dd> <!-- END switch_no_dl_att --> <dd>;({postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</dd> </dl> <!-- END switch_post_attachments --> </dd> </dl> <!-- END switch_attachments --> <div class="clear"></div> </div> </div> </div> </div> <!-- BEGIN switch_signature --> <div class="sig-content">{postrow.displayed.SIGNATURE_NEW}</div> <!-- END switch_signature --> <div class="postfoot"> <div class="options-button user-contact">{postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG} <!-- BEGIN contact_field -->{postrow.displayed.contact_field.CONTENT} <!-- END contact_field --> </div> <div class="post-options"> <iframe style="display:none" name="vote{postrow.displayed.U_POST_ID}" height="0px" width="0px" frameborder="0"></iframe> <div onmouseover="show_like({postrow.displayed.U_POST_ID})" onmouseout="hide_like({postrow.displayed.U_POST_ID})" class="FMvi-like"> <div id="nub{postrow.displayed.U_POST_ID}" class="nub"></div> <div id="like{postrow.displayed.U_POST_ID}" class="commentLike"> <span class="closeFMvi_like" style="display:none" onclick="close_like({postrow.displayed.U_POST_ID})"></span> <p></p> <div class="loaddingLike"></div> <em>Dejar un comentario en su muro {postrow.displayed.POSTER_NAME}<br /></em> <input onkeyup="send_comment(event,{postrow.displayed.U_POST_ID})" type="text" value="" /> </div> <div style="display:none" id="data-link-comment{postrow.displayed.U_POST_ID}"></div> <!-- BEGIN switch_vote_active --> <!-- BEGIN switch_vote --> <a style="display:none" class="likeplus" href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}"><p class="likeNone">Thích</p></a> <!-- END switch_vote --> <!-- BEGIN switch_bar --> <div style="display:none" class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}"> <!-- BEGIN switch_vote_plus --> <div class="vote-bar-plus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div> <!-- END switch_vote_plus --> <!-- BEGIN switch_vote_minus --> <div class="vote-bar-minus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div> <!-- END switch_vote_minus --> </div> <!-- END switch_bar --> <!-- BEGIN switch_vote --> <a style="display:none" class="likeminus" href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}">Báo xấu</a> <!-- END switch_vote --> <!-- END switch_vote_active --> </div> <span class="options-button">{postrow.displayed.THANK_IMG} {postrow.displayed.MULTIQUOTE_IMG} {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} {postrow.displayed.IP_IMG} {postrow.displayed.REPORT_IMG}</span></div> <div style="clear:both;"></div> </div> </div> </div> <!-- BEGIN first_post_br --> </div> <hr id="first-post-br" /> <div class="main-content topic"> <!-- END first_post_br --> <!-- END displayed --> <!-- BEGIN hidden --> <p class="p-hidden">{postrow.hidden.MESSAGE}</p> <!-- END hidden --> <!-- END postrow --> </div> <script type="text/javascript" src="http://fmvi-group.googlecode.com/files/FMvi-avatar-like.js"></script></div><div class="main-foot clearfix"><p class="h2"><a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a> <a href="#top">{L_BACK_TO_TOP}</a> {L_MESSAGE} [{PAGE_NUMBER}]</p><p class="options"><input type="hidden" name="t" value="{TOPIC_ID}" /><!-- <input type="hidden" name="sid" value="{S_SID}" /> --><input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" /><!-- BEGIN viewtopic_bottom -->{S_TOPIC_ADMIN}<!-- END viewtopic_bottom --></p></div><a name="bottomtitle"></a><div class="paged-foot clearfix"><!-- BEGIN topicpagination --><p class="paging">{PAGINATION}</p><!-- END topicpagination --><p class="posting"><!-- BEGIN switch_user_authpost --><a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a> <!-- END switch_user_authpost --><!-- BEGIN switch_user_authreply --><a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /></a><!-- END switch_user_authreply --></p></div></div><div class="pun-crumbs"><p class="crumbs"><a href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC} » <strong><a href="{TOPIC_URL}">{TOPIC_TITLE}</a></strong></p></div><!-- BEGIN promot_trafic --><div class="main" id="ptrafic_close" style="display:none"><div class="main-head clearfix"><p class="h2">{PROMOT_TRAFIC_TITLE}</p><p class="options"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img src="{TABS_MORE_IMG}" alt="+" align="" border="0" /></a></p></div></div><div class="main" id="ptrafic_open" style="display:''"><div class="main-head clearfix"><p class="h2">{PROMOT_TRAFIC_TITLE}</p><p class="options"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img src="{TABS_LESS_IMG}" alt="-" align="" border="0" /></a></p></div><div class="main-content clearfix"><!-- BEGIN link -->» <a href="{promot_trafic.link.U_HREF}" target="_blank" title="{promot_trafic.link.TITLE}">{promot_trafic.link.TITLE}</a><br /><!-- END link --></div></div><!-- END promot_trafic --><!-- BEGIN switch_forum_rules --><div class="main" id="forum_rules"><div class="main-head clearfix"><p class="h2">{L_FORUM_RULES}</p></div><table class="main-content frm"><tr><!-- BEGIN switch_forum_rule_image --><td class="logo"><img src="{RULE_IMG_URL}" /></td><!-- END switch_forum_rule_image --><td class="rules entry-content">{RULE_MSG}</td></tr></table></div><!-- END switch_forum_rules --><!-- BEGIN switch_user_logged_in --><a name="quickreply"></a>{QUICK_REPLY_FORM}<!-- END switch_user_logged_in --><div id="pun-info" class="main"><div class="main-content"><div id="stats"><p>{L_TABS_PERMISSIONS} <br />{S_AUTH_LIST}</p></div></div></div><!-- BEGIN switch_image_resize --><script type="text/javascript">//<![CDATA[$(resize_images({ 'selector' : '.post-entry .entry-content', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));//]]></script><!-- END switch_image_resize -->
<script src="{JS_DIR}addthis/addthis_widget.js" type="text/javascript"></script>
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
...
Bla , Bla , Bla ...
...
<!-- BEGIN switch_fb_login -->
- Code:
<!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" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB} {NAMESPACE_BBCODE}>
<head>
<title>{SITENAME_TITLE}{PAGE_TITLE}</title>
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
<!-- BEGIN switch_compat_meta -->
<meta http-equiv="X-UA-Compatible" content="IE={switch_compat_meta.VERSION}" />
<!-- END switch_compat_meta -->
<!-- BEGIN switch_canonical_url -->
<link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}" />
<!-- END switch_canonical_url -->
{META_FAVICO}
{META}
{META_FB_LIKE}
<meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" />
{T_HEAD_STYLESHEET}
{CSS}
<!--[if lte IE 6]>
<style type="text/css">
.post-entry .entry-content img{display: block !important}
body{background-color: #FFFFFF!important}
#mudimPanel,.minwidth_IE, #login_popup, #hitskin_preview{display:none!important}
</style>
<![endif]-->
<noscript>
<style type="text/css">
a.mainmenu[href='/groups'],a.mainmenu[href='/privmsg?folder=inbox']{display:block !important}
.post-entry .entry-content img{display: block !important}
#left{display:block !important}
.module .main-content{height: 12.3em !important}
.toppost_width{width: 290px;}
.recentWidth{width: 658px;}
.latest_topics{overflow: hidden !important; height: 12.3em !important}
.chatbox, .fmviToggle, #checktip .open{display:none}
</style>
</noscript>
<link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" />
<link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" />
<script src="{JQUERY_PATH}" type="text/javascript"></script>
<script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>
<script type="text/javascript">
function langEV() {
if ($("html").attr("xml:lang") == "en") {
return true;
} else if ($("html").attr("xml:lang") == "vi") {
return false;
}
}
</script>
<!-- BEGIN switch_fb_login -->
