[Code] bbcode phân trang trong bài viết

  • Admin
    1. [Code] bbcode phân trang trong bài viết
    avatar ACP

    bbcode phân trang trong bài viết


    Mẹo này có thể hoạt động thêm một nút để trình biên tập mà chèn một thẻ [đầu trang] để tạo ra một số trang trong một tin nhắn:


    Css

    Code:
    .postpagination span {
        float: left;
        display: inline;
        margin-left: 4px;
        padding: 0 8px;
        height: 26px;
        border: 1px solid;
        border-color: #C2D5E3;
        background-color: #FFF;
        background-repeat: no-repeat;
        color: #333;
        overflow: hidden;
        text-decoration: none;
        margin: 0 4px 0 0;
        line-height: 26px;
        cursor: pointer;
        font-weight: normal;
    }
    .postpagination span:hover {
        border-color: #369;
        color: #369;
    }
    .postpagination span.pp_current {
        background-color: #E5EDF2;
        border-color: #C2D5E3;
        color: #333;
        font-weight: bold;
    }
    .postpagination {
        display: block;
        font: 12px/1.5 Tahoma,Helvetica,'SimSun',sans-serif;
    }
    .postpagination:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }
    div.postpagination { margin: 10px 0 }
    span.postpagination span {
        float: none;
        padding: 0 4px;
        font-size: 0.8em;
        margin: 0 2px 0 0;
    }
    .postpagination span.pp_next {
        padding-right: 25px;
        background-image: url(http://i.imgur.com/2C4dvL5.gif);
        background-position: 90% 50%;
    }
    span.postpagination span.pp_next {
        padding-right: 12px;
        background-position: 90% 50%;
    }

    Jquery

    Code:
    $(function() {
      var x= "selecteur_suivant_version";
      if($("#text_editor_textarea").length && $.sceditor) {
        $(function() {
          if(!$("#text_editor_textarea").sceditor("instance")) {
            return
          }
          $('<a class="sceditor-button" unselectable="on" title="Page"><div unselectable="on" style="background:url(http://i.imgur.com/a3RgTJc.gif);opacity:1">Page</div></a>').insertAfter(".sceditor-button-fahide").click(function(e) {
            $("#text_editor_textarea").sceditor("instance").insertText("[page]")
          })
        })
      }
      var c, y, g = function(a) {
        var b;
        a = document.createElement(a);
        b = "getComputedStyle" in window;
        document.body.appendChild(a);
        b = (b ? window.getComputedStyle(a, "") : a.currentStyle).display;
        document.body.removeChild(a);
        return b
      }, t = function(o) {
        if(o.tagName == "CODE") {
          return
        }
        if(!o.hasChildNodes()) {
          return
        }
        var a = 0;
        var p = [0];
        var i;
        for(i = 0;i < o.childNodes.length;i++) {
          c = o.childNodes[i];
          if(c.nodeType == 1) {
            p.push(c);
            t(c)
          }else {
            if(c.nodeType == 3 && c.nodeValue.indexOf("[page]") != -1) {
              while((y = c.nodeValue.indexOf("[page]")) != -1) {
                if(y != 0) {
                  p.push(document.createTextNode(c.nodeValue.substr(0, y)))
                }
                p.push(0);
                a++;
                c.nodeValue = c.nodeValue.substr(y + 6)
              }
              p.push(c)
            }else {
              p.push(c)
            }
          }
        }
        if(a == 0) {
          return
        }
        var b = g(o.tagName) == "block";
        for(i = 0;i < p.length;i++) {
          if(p[i] === 0) {
            y = document.createElement(b ? "DIV" : "SPAN");
            y.className = "postpage";
            o.appendChild(y)
          }else {
            y.appendChild(p[i])
          }
        }
        $("> .postpage", o).not(":first").hide();
        y = document.createElement(b ? "DIV" : "SPAN");
        y.className = "postpagination";
        $(y).append('<span class="pp_current">1</span><span>2</span>');
        if(a > 1) {
          $(y).append("<span>... " + (a + 1) + "</span>")
        }
        if(b) {
          $(y).append('<span class="pp_next">Suivant</span><span class="pp_all">Voir tout</span>')
        }else {
          $(y).append('<span class="pp_next"></span>')
        }
        o.appendChild(y);
        $(y).on("click", "span", function() {
          if($(this).hasClass("pp_all")) {
            $(this).parent().parent().children().show();
            $(this).parent().remove();
            return
          }
          var pagin = $(this).parent();
          var num = parseInt($(".pp_next", pagin).prev().text().replace(/ ?\.\.\. ?/, ""));
          var cur = parseInt($(".pp_current", pagin).text().replace(/ ?\.\.\. ?/, ""));
          if($(this).hasClass("pp_next")) {
            cur += 1
          }else {
            cur = parseInt($(this).text().replace(/ ?\.\.\. ?/, ""))
          }
          if(cur < 1) {
            cur = 1
          }else {
            if(cur > num) {
              cur = num
            }
          }
          $(".pp_next", pagin).prevUntil().remove();
          if(cur < num - 1) {
            $(pagin).prepend("<span>... " + num + "</span>")
          }else {
            if(cur == num) {
              $(pagin).prepend('<span class="pp_current">' + num + "</span>")
            }
          }
          if(cur < num) {
            $(".pp_next", pagin).show();
            $(pagin).prepend('<span class="pp_current">' + cur + "</span><span>" + (cur + 1) + "</span>")
          }else {
            $(".pp_next", pagin).hide()
          }
          if(cur > 1) {
            $(pagin).prepend("<span>" + (cur - 1) + "</span>");
            if(cur > 2) {
              $(pagin).prepend("<span>1 ...</span>")
            }
          }
          $(".postpage", $(pagin).parent()).hide();
          $(".postpage", $(pagin).parent()).eq(cur - 1).show()
        })
      };
      $(x).each(function() {
        t(this)
      })
    });

    Tùy thuộc vào phiên bản của bạn, thay thế mã selecteur_suivant_version

    pour phpbb3 :

    Code:
    div.postbody .content


    pour phpbb2 :

    Code:
    div.postbody


    pour invision :

    Code:
    div.postbody div.post-entry


    pour punbb :

    Code:
    div.post-entry .entry-content > div


    Nguồn :
    Code:
    http://forum.forumactif.com/t355762-pagination-dans-un-message?highlight=pagination

    Tags: #code #forumotion #bbcode

Thông tin tác giả
avatar
ACP
Bài viết :
311
Points :
605
Like :
103
Punbb
Quản trị
Status :
test
Xem lý lịch thành viên http://www.hotrofm.net
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