Anh Admin có thể share cho e và mọi người cách sử dụng colorbox được không , colorbox như diễn đàn miền ký ức có thể bắt link ảnh tự động, xem video, làm tdyt, còn cả xem ảnh slide nữa.

Tình cờ bên c3z em có đọc được bài này [You must be registered and logged in to see this link.]

chắc anh phải vất vả lắm mới làm được thành công như vậy:(( , e thì ko biết gì về code, chỉ biết xin anh được chia sẻ thôi. Mong anh chú ý bài này và giúp e với ngeng

Cảm ơn anh trước!

Chắc bạn cũng là một Admin phải không. Mình cũng là một Admin nè,câu hỏi của bạn mình cũng đã hỏi nhiều rồi, nhưng mình thấy bây giờ mấy người Pro đa phần toàn là "bán" chất xám chứ không cho không đâu bạn à. Còn anh Admin bên này thì sao mình chưa biết được. Goog luck !

mod xem ảnh = colorbox này làm khó đấy,tùy theo mỗi 4rum mà sửa đoạn script cho phù hợp,mình xem 4rum bạn rồi,bây giờ bạn làm mod xem ảnh = slimbox trước đi. bây giờ mod xem ảnh = colorbox này đang hot nên chưa share được.
p/s: nếu bạn cần giúp đỡ vui lòng pm 01674578867.

Hiện tại em cũng đang dùng slimbox, nhưng nó chỉ mỗi xem ảnh được, có gì anh em mình nc chút nha, biết đâu em với anh sẽ hiểu nhau hơn chăng, dảnh nc với e nha y!m: nhock.demon9x mong một ngày đẹp trời em sẽ thấy được bài viết hướng dẫn sử dụng colorbox đầy đủ

4rum bạn ít thành viên thì xài tạm cái slimbox được rùi

Mình thấy bạn rất có lòng xin nên mình xin hướng dẫn bạn và mọi người luôn. Các bạn làm theo các bước cơ bản mình hướng dẫn như sau. Cái này hên xui nha, có 4rum chạy được có 4rum ko. Còn lý do thì mình cũng bó tay.

Chèn vào CSS :

Code:

/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/*
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;}
#colorbox{}
    #cboxTopLeft{width:14px; height:14px; background:url(http://i64.servimg.com/u/f64/15/44/78/93/contro10.png) no-repeat 0 0;}
    #cboxTopCenter{height:14px; background:url(http://i64.servimg.com/u/f64/15/44/78/93/border10.png) repeat-x top left;}
    #cboxTopRight{width:14px; height:14px; background:url(http://i64.servimg.com/u/f64/15/44/78/93/contro10.png) no-repeat -36px 0;}
    #cboxBottomLeft{width:14px; height:43px; background:url(http://i64.servimg.com/u/f64/15/44/78/93/contro10.png) no-repeat 0 -32px;}
    #cboxBottomCenter{height:43px; background:url(http://i64.servimg.com/u/f64/15/44/78/93/border10.png) repeat-x bottom left;}
    #cboxBottomRight{width:14px; height:43px; background:url(http://i64.servimg.com/u/f64/15/44/78/93/contro10.png) no-repeat -36px -32px;}
    #cboxMiddleLeft{width:14px; background:url(http://i64.servimg.com/u/f64/15/44/78/93/contro10.png) repeat-y -175px 0;}
    #cboxMiddleRight{width:14px; background:url(http://i64.servimg.com/u/f64/15/44/78/93/contro10.png) repeat-y -211px 0;}
    #cboxContent{background:#fff; overflow:visible;}
        #cboxLoadedContent{margin-bottom:5px;}
        #cboxLoadingOverlay{background:url(http://i64.servimg.com/u/f64/15/44/78/93/th/loadin10.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(http://i64.servimg.com/u/f64/15/44/78/93/th/loadin11.gif) no-repeat center center;}
        #cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;}
        #cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;}
       
        #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(http://i64.servimg.com/u/f64/15/44/78/93/contro10.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;}
        #cboxPrevious{left:0px; background-position: -51px -25px;}
        #cboxPrevious.hover{background-position:-51px 0px;}
        #cboxNext{left:27px; background-position:-75px -25px;}
        #cboxNext.hover{background-position:-75px 0px;}
        #cboxClose{right:0; background-position:-100px -25px;}
        #cboxClose.hover{background-position:-100px 0px;}
       
        .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}
        .cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}
        .cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}

Chèn đoạn script này vào over header trước thẻ

Code:

<script src="http://benxua.googlecode.com/files/jquery.min.js"></script>
   <script src="http://benxua.googlecode.com/files/jquery.colorbox.js"></script>
   
<script>
      $(document).ready(function(){
         //Examples of how to assign the ColorBox event to elements
         $("a[rel='pic']").colorbox();
         $("a[rel='example2']").colorbox({transition:"fade"});
         $("a[rel='fix']").colorbox({transition:"none", width:"75%", height:"75%"});
         $("a[rel='slide']").colorbox({slideshow:true});
         $(".example5").colorbox();
         $(".clip").colorbox({iframe:true, innerWidth:425, innerHeight:344});
         $(".web").colorbox({width:"80%", height:"80%", iframe:true});
         $(".example8").colorbox({width:"50%", inline:true, href:"#inline_example1"});
         $(".example9").colorbox({
            onOpen:function(){ alert('onOpen: colorbox is about to open'); },
            onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
            onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
            onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
            onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
         });
         
         //Example of preserving a JavaScript event for inline calls.
         $("#click").click(function(){
            $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
            return false;
         });
      });
   </script>
<script type="text/javascript">function resizeimg() {var maxHeight = 220;for (var i = 0; i < document.images.length; i++){if(document.images[i].height > maxHeight ){image = new Image();image = document.images[i];linkimage = document.images[i].src;newImage = image.cloneNode( true )  ;if( parentNode = image.parentNode ){elem = document.createElement("a");elem.setAttribute( "href", linkimage );elem.setAttribute( "rel", "img");elem.setAttribute( "title", "Xem ảnh với kích thước thật");elem.appendChild( newImage );            frag = document.createElement("div");frag.appendChild( elem );if( image.outerHTML ){image.outerHTML = frag.innerHTML;} else {parentNode.replaceChild( elem, image );}}}}};if (document.addEventListener) {document.addEventListener("DOMContentLoaded", resizeimg, false);}window.onload = resizeimg; </script>

Chúc các bạn thành công. Mình chỉ có thể giúp tới đây thôi, mình còn gà lắm.

Demo : [You must be registered and logged in to see this link.]

Trê bai gì vậy, chẳng lẽ chỉ vì ít thành viên mà không được dùng colorbox à, tôi học hỏi kinh nghiệm chứ có liên quan gì đến thành viên đâu.

Em đừng nóng chứ,có j̀ thj̀ liên lạc vớj Admin đê,mấy thành viên nój j̀ kệ họ.

cunnho đã viết:Trê bai gì vậy, chẳng lẽ chỉ vì ít thành viên mà không được dùng colorbox à, tôi học hỏi kinh nghiệm chứ có liên quan gì đến thành viên đâu.

Xin lỗi em nhưng em hỏi cái này thì anh chưa thể share được, 4rum nào cũng muốn có một nét riêng của riêng mình để thu hút thành viên và khẳng định chất lượng. Bạn thử đi qua các 4rum lớn xem, có bao nhiêu bài viết hỏi về colorbox nhưng đã có ai share chưa. Ngay cả Việt K cũng còn muốn giữ làm của riêng kìa. Nếu mà cái gì hay và mới các bạn đều xin hết thì giữa các 4rum còn gì là khác biệt nữa chứ !

Ít thì sao chứ, chẳng lẽ ít thành viên là không được sử dụng sao, tui muốn được học hỏi và khám phá về thế giới công ngệ thông tin là chính và góp phần làm đẹp cho diễn đàn của mình, mình thật là chán khi nghe bạn nói vậy.

Mỗi người có niềm đam mê riêng, và từ khi vào FM mình có niềm đam mê đó là chinh phục fm, bạn không làm fm hoặc làm 1 Admin bạn không hiểu được đâu.

cunnho đã viết:Ít thì sao chứ, chẳng lẽ ít thành viên là không được sử dụng sao, tui muốn được học hỏi và khám phá về thế giới công ngệ thông tin là chính và góp phần làm đẹp cho diễn đàn của mình, mình thật là chán khi nghe bạn nói vậy.

Mỗi người có niềm đam mê riêng, và từ khi vào FM mình có niềm đam mê đó là chinh phục fm, bạn không làm fm hoặc làm 1 Admin bạn không hiểu được đâu.

Em nói anh hả ! Nếu vậy thì anh cũng chịu thôi. Thực sự là cái Colorbox này anh chưa thể share được, mong em thông cảm , bởi nó liên quan tới nhiều thứ như mod Vote, mod Nhân vật theo giới tính [sắp tới sẽ ra mắt],....

Không, em nói bạn ngok_ze_thuong này cơ, chứ em ko nói anh, thui anh đã quyết giữ làm của riêng em cũng chịu rồi. ^^! mong một ngày sẽ được anh share thui, thank anh nhìu ngeng!

Chắc em sẽ phải tự tìm hiểu rồi, có gì anh hỗ trợ em nha!

cunnho đã viết:Không, em nói bạn ngok_ze_thuong này cơ, chứ em ko nói anh, thui anh đã quyết giữ làm của riêng em cũng chịu rồi. ^^! mong một ngày sẽ được anh share thui, thank anh nhìu ngeng!

Chắc em sẽ phải tự tìm hiểu rồi, có gì anh hỗ trợ em nha!

Uhm, em hiểu và thông cảm cho anh là anh vui rồi, chúc em ngày càng giỏi FM nhé.

Anh Quangtrung ơi, anh cho em hỏi này xíu.



như ảnh ở trên đó anh, anh cho em xin đoạn code để chia từng mục bảng ra nha, chia từng mục như tin nóng, quà tặng âm nhạc, video.

Em đang thử dùng skin svnh mà tìm hoài ko chia từng bảng ra riêng một được, skin này có nhiều code rắc rối quá.

Với với... anh...a...nh...cho em xin code viewtopic được không anh ^^! chia sẻ cho em ngeng anh ^^!

cunnho đã viết:Anh Quangtrung ơi, anh cho em hỏi này xíu.



như ảnh ở trên đó anh, anh cho em xin đoạn code để chia từng mục bảng ra nha, chia từng mục như tin nóng, quà tặng âm nhạc, video.

Em đang thử dùng skin svnh mà tìm hoài ko chia từng bảng ra riêng một được, skin này có nhiều code rắc rối quá.

Với với... anh...a...nh...cho em xin code viewtopic được không anh ^^! chia sẻ cho em ngeng anh ^^!

Anh xin trả lời thắc mắc thứ nhất là : em muốn chia ra từng bảng thì dùng code sau đóng khung lại là được. Sau này nếu khả năng em khá hơn em có thể rip code mặc định cho tất cả widget sẽ có khung như vậy. Cái này anh không có thời gian hướng dẫn nên em tự tìm hiểu nha.

Code:

<div class="boxcontainer"> <div class="box_04"> <div class="box_05"> <table style="width: 100%" cellpadding="0" cellspacing="0" dir="ltr"> <tr> <td class="box_01"> <img class="imgborder" src="http://2img.net/i/fa/empty.gif" width="13" height="37" alt="" /></td> <td class="boxheaderbar"> <table border="0" width="100%" cellpadding="0" style="border-collapse: collapse"> <tr> <td valign="top"> </td> <td width="100%"> <div class="boxbar"> <table border="0" width="100%" cellpadding="0" style="border-collapse: collapse"> <tr> <td class="boxcolorbar_01"> <img class="imgborder" src="http://2img.net/i/fa/empty.gif" width="6" height="24" alt="" /></td> <td class="boxcolorbar">Bảng bầu chọn Miền ký ức Forum's</td> <td class="boxcolorbar_03"> <img src="http://2img.net/i/fa/empty.gif" width="6" height="24" alt="" class="imgborder" /></td> </tr> </table> </div> </td> <td> <img src="http://i74.servimg.com/u/f74/15/44/78/93/logo2110.jpg" width="35" height="37" alt="" class="imgborder" /></td> </tr> </table> </td> <td class="box_03"> <img class="imgborder" src="http://2img.net/i/fa/empty.gif" width="13" height="37" alt="" /></td> </tr> </table> <div class="boxcontents"><table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">

Nội dung cần đóng khung

</table>
</div> <table style="width: 100%" cellpadding="0" cellspacing="0" dir="ltr"> <tr> <td class="box_06"> <img class="imgborder" src="http://2img.net/i/fa/empty.gif" width="8" height="6" alt="" /></td> <td style="width: 100%" class="boxfooterbar"></td> <td class="box_08"> <img class="imgborder" src="http://2img.net/i/fa/empty.gif" width="8" height="6" alt="" /></td> </tr> </table> </div> </div> </div>

Câu hỏi thứ 2 là cái viewtopic body : anh chỉ có thể share bản này thôi, em tự làm lại theo ý mình nha.

Trong cái view anh share có thanh level auto + nút ko chuyển trang,....còn nữa em tự xem.
Tải file đính kèm bên dưới về dùng ha.

Vấn đề thứ nhất giải quyết ngon rồi anh, nhưng cái thứ 2 em hơi thắc mắc chút xíu. Cái thanh level auto + nút Thank ý anh. Thank nó không làm được như diễn đàn mình hả anh, còn thanh level nó không hiện anh ạ.

cunnho đã viết:Vấn đề thứ nhất giải quyết ngon rồi anh, nhưng cái thứ 2 em hơi thắc mắc chút xíu. Cái thanh level auto + nút Thank ý anh. Thank nó không làm được như diễn đàn mình hả anh, còn thanh level nó không hiện anh ạ.

Như anh đã nói, cái view đó em về tự sửa lại mới được, nói chung dùng cũng khá ổn rùi. Trong cái view đó có thanh level mà 4rum mình dùng trước khi thay mod nhân vật theo giới tính đó, còn nút không chuyển trang chắc là hoạt động được, nó chỉ reload lại trang khi nhấn thank thôi, còn mod vote ko chuyển trang mà 4rum mình đang dùng thì hoàn toàn khác.