[Punbb] Avatar drop - style phutu.vn

  • Giựt
    1. [Punbb] Avatar drop - style phutu.vn
    avatar MOD

    Demo





    Cách làm


    Vào APC >> Display >> Quản lý tổng thể >> view_topic tìm đoạn sau :

    Code:
    {postrow.displayed.POSTER_AVATAR}

    Thay đoạn trên thành :

    Code:
    <span class="ava_pt"><span><table border="0" cellpadding="0" cellspacing="0"><tbody><tr><td align="center">{postrow.displayed.POSTER_AVATAR}</td></tr></tbody></table></span></span>
    <div class="profile">
      <div class="poster-info" style="display:none">
        <div>
          <span class="poster-name">                            
                                    {postrow.displayed.POSTER_NAME}                          
                        </span>
          <span class="poster-connect">                            
                                    {postrow.displayed.ONLINE_IMG}
                        </span>
          <span class="poster-rank">
                                    {postrow.displayed.RANK_IMAGE}        
                        </span>
        </div>
      </div>
      <div style="height:40px;width:100%;overflow:hidden" class="poster-field">
        <!-- BEGIN profile_field -->
        <p>{postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}</p>
        <!-- END profile_field -->
      </div><span class="profile11"> <div class="zzPoster-name" style="display:none">
                              </div> <span class="poster-link"><a target="_blank" href="/profile.forum?mode=viewprofile&u=POSTER_NAME&page_profil=messages">Tường</a>                          
          <a target="_blank" href="/spa/POSTER_NAME">Bài viết</a>                          
          <a target="_blank" href="/profile?friend=POSTER_NAME&mode=editprofile&page_profil=friendsfoes">Kết bạn</a>              
          <a target="_blank" href="/profile?foe=POSTER_NAME&mode=editprofile&page_profil=friendsfoes">Chặn</a>                        
          </span> </span><span style="background-image: url(http://i.imgur.com/U09NXkO.png);background-repeat:no-repeat;width:21px;height:11px;display:inline-block;float:left;margin-bottom:-7px;margin-top:7px"></span></div><div class="lasnamevl" style="display:none">{postrow.displayed.POSTER_NAME}</div>

    Thêm vào cuối view_topic code :

    Code:

    $(document).on('ready', function() {
        $(".poster-link a").attr("href", function() {
            return this.href.replace(/POSTER_NAME/, encodeURI($.trim($(this).parent().prev(".lasnamevl").text())))
        });
    });

    Lưu ý: Thay .poster-info thành thẻ chứa thông tin thành viên, thay .poster-name thành thẻ chứa tên thành viên để nó find

    Vào css thêm :

    Code:
    /*Drop-rip by Giựt*/
    .profile {
        width: 290px;
        height: 97px;
        position: absolute;
        margin-left: -1px;
        background: url(http://i.imgur.com/IdTTHEE.png);
        border: 1px solid rgb(189, 190, 189);
        margin-top: -200px;
        z-index: 1;
        text-align: left;
        padding: 5px 10px 0px 20px;
        box-shadow: 0 0 2px rgb(231, 231, 231);
        display: none;
    }
    .profile span {
      font-weight: bold
    }

    .profile div {
      width: 135px;
      display: inline-block;
      color: #31414a;
      font: 11px Tahoma;
      margin: 2px 0px
    }

    .pun .profile .label {
      display: inline-block;
      width: 75px;
    }

    .profile div:nth-of-type(5) {
      display: none
    }

    .profile11 {
      width: 300px;
      display: inline-block;
      float: right;
      margin-top: 15px;
      padding-top: 5px;
      border-top: 1px dashed #d4d4d4
    }

    .poster-link a {
      float: left;
      display: inline-block;
      margin-right: 2px;
      font: bold 12px Arial;
      padding: 5px 5px 5px 25px;
      background-repeat: no-repeat;
      background-position: 5px center
    }
    .poster-field p{line-height:20px;color:#999;width:160px;display:inline-block}
    .poster-link a:hover {
      background-color: rgb(239, 239, 247)
    }

    .poster-link a:nth-of-type(1) {
      background-image: url(http://i48.servimg.com/u/f48/16/58/89/73/profil10.png)
    }

    .poster-link a:nth-of-type(2) {
      background-image: url(http://i48.servimg.com/u/f48/16/58/89/73/total_10.gif)
    }

    .poster-link a:nth-of-type(3) {
      background-image: url(http://i48.servimg.com/u/f48/16/58/89/73/friend10.png)
    }

    .poster-link a:nth-of-type(4) {
      background-image: url(http://i57.servimg.com/u/f57/17/05/17/70/button10.png)
    }

    .profile:hover,
    .ava_pt:hover+.profile {
      display: inline-block!Important
    }

    Chú ý: Ở dòng thứ 5 và dòng 8 ở code trên , thay thông số phù hợp với forum bạn Very Happy

    - Chỉ được dùng cho phiên bản punbb

    Nguồn


    HotroFM ( http://www.hotrofm.net/ )

    Made by Giựt



    Được sửa bởi trandangduat ngày 27.09.16 16:10; sửa lần 2.

  • Giựt
    2. Re: [Punbb] Avatar drop - style phutu.vn
    avatar MOD
    Đã up thêm hướng dẫn cụ thể Very Happy


    --Chữ ký--
    Diễn đàn Kênh Game 360>> Smile
  • Ông Sói
    3. Re: [Punbb] Avatar drop - style phutu.vn
    avatar MOD
    Báo công an nhé !


    --Chữ ký--
      cười lăng lộn ĐẸP TRAI NHẤT HOTROFM.NET  Very Happy


    - Tổng hợp Codes và Tuts cho forumotion tại hotrofm.net
    - Tổng hợp Skins tại hotrofm.net
  • Giựt
    4. Re: [Punbb] Avatar drop - style phutu.vn
    avatar MOD
    Đờ-Cai đã viết:Báo công an nhé !

    Báo giề Smile

  • Admin
    5. Re: [Punbb] Avatar drop - style phutu.vn
    avatar ACP
    e kiểm tra lại demo nhé. a xem demo thấy có dc đâu nhỉ :)


    --Chữ ký--
    www.danganhviet.com


    • - Tránh đặt tiêu đề các dạng như: Giúp em với, Code này hay nè, Vào xem nè anh em,...
      - Đăng bài phải có ảnh demo hoặc viết mô tả rõ ràng, code phải bỏ vào khung code
      - Không comment vô nghĩa, không spam, không chữi tục, không post link độc hại, không hide bài viết
      - Hạn chế viết tắt, viết chữ màu, chữ to, chữ in đậm
  • Giựt
    6. Re: [Punbb] Avatar drop - style phutu.vn
    avatar MOD
    @Admin đã viết:e kiểm tra lại demo nhé. a xem demo thấy có dc đâu nhỉ :)

    Bềnh thường mà anh Very Happy

  • Admin
    7. Re: [Punbb] Avatar drop - style phutu.vn
    avatar ACP
    đã fix lại từ Ťitus đẹp trai


    --Chữ ký--
    www.danganhviet.com


    • - Tránh đặt tiêu đề các dạng như: Giúp em với, Code này hay nè, Vào xem nè anh em,...
      - Đăng bài phải có ảnh demo hoặc viết mô tả rõ ràng, code phải bỏ vào khung code
      - Không comment vô nghĩa, không spam, không chữi tục, không post link độc hại, không hide bài viết
      - Hạn chế viết tắt, viết chữ màu, chữ to, chữ in đậm
  • Giựt
    8. Re: [Punbb] Avatar drop - style phutu.vn
    avatar MOD
    @Admin đã viết:đã fix lại từ Ťitus đẹp trai

    Anh sửa hộ em cái demo Very Happy éo hiểu forum test của em sửa rồi vẫn éo đc :v

  • Kou94
    9. Re: [Punbb] Avatar drop - style phutu.vn
    avatar MEM LV3
    @Giựt đã viết:
    @Admin đã viết:đã fix lại từ Ťitus đẹp trai

    Anh sửa hộ em cái demo Very Happy éo hiểu forum test của em sửa rồi vẫn éo đc :v
    Như trên

  • Sponsored content

Thông tin tác giả
avatar
MOD
Bài viết :
273
Points :
440
Like :
89
Punbb
Cẩn thận
Status :
Giựt đẹp trai
Xem lý lịch thành viên
Thông tin tác giả
avatar
MOD
Bài viết :
273
Points :
440
Like :
89
Punbb
Cẩn thận
Status :
Giựt đẹp trai
Xem lý lịch thành viên
Thông tin tác giả
avatar
MOD
Bài viết :
103
Points :
192
Like :
39
PhpBB3
An toàn
Status :
Cu To
Xem lý lịch thành viên
Thông tin tác giả
avatar
MOD
Bài viết :
273
Points :
440
Like :
89
Punbb
Cẩn thận
Status :
Giựt đẹp trai
Xem lý lịch thành viên
Thông tin tác giả
avatar
ACP
Bài viết :
310
Points :
604
Like :
103
Punbb
Quản trị
Status :
test
Xem lý lịch thành viên http://hotrofm.forumvi.com
Thông tin tác giả
avatar
MOD
Bài viết :
273
Points :
440
Like :
89
Punbb
Cẩn thận
Status :
Giựt đẹp trai
Xem lý lịch thành viên
Thông tin tác giả
avatar
ACP
Bài viết :
310
Points :
604
Like :
103
Punbb
Quản trị
Status :
test
Xem lý lịch thành viên http://hotrofm.forumvi.com
Thông tin tác giả
avatar
MOD
Bài viết :
273
Points :
440
Like :
89
Punbb
Cẩn thận
Status :
Giựt đẹp trai
Xem lý lịch thành viên
Thông tin tác giả
avatar
MEM LV3
Bài viết :
112
Points :
165
Like :
9
Punbb
An toàn
Xem lý lịch thành viên
Thông tin tác giả
Sponsored content
Bài viết liên quan
    Đang tải dữ liệu

Permissions in this forum:
Bạn không có quyền trả lời bài viết