Tìm kiếm nhanh

[Share] Block weblink Nukeviet 4 theo chuyên mục

Thảo luận trong 'Blocks' đăng bởi dangdinhtu, 02/07/2016 06:03.

  • dangdinhtu

    dangdinhtu Đặng Đình Tứ

    Điều hành viên Quản trị diễn đàn

    Demo:

    Yêu cầu hệ thống với sử dụng module weblink mặc định của Nukeviet

    Hướng dẫn cài đặt tự động:

    Đăng nhập quản trị site => Mở rộng => Cài dặt gói ứng dụng => Chọn tệp tin vừa tải về => Tiến hành cài đặt theo hướng dẫn của hệ thống tới khi hoàn tất.

    Để kích hoạt block bạn có thể sử dụng chức năng bật kéo thả block hoặc tại admin vào Quản lý giao diện quản lý block và tiến hành thêm block như thông thường

     

    Tệp đính kèm:

    Lần sửa cuối bởi một điều hành viên: 03/07/2016 14:29
    lyhuutrong huongpro_love Đông Gioăng thích điều này.
  • huongpro_love

    huongpro_love Nguyễn Văn Hưởng

    Hay quá anh :D này dùng làm block đối tác được hì

     
  • Đông Gioăng

    Đông Gioăng Chung Bảo Ngọc

    Giải nén đưcọ em c

    Giải nén đc em chặt đầu đi luôn

     
    Lần sửa cuối bởi một điều hành viên: 03/07/2016 14:28
  • aptx4869

    aptx4869 Trần Phương

    mình là mình còn ko down dc đây này !!!. Cái này thêm mấy cáo js scroll thì ngon nhỉ

     
  • lyhuutrong

    lyhuutrong LÝ HỮU TRỌNG

    Bác Tứ để bên trên footer là ngon rồi kiểu như bạn ấy nói là đối tác á.

     
    Lần sửa cuối bởi một điều hành viên: 03/07/2016 14:28
  • hoanglongvnpt

    hoanglongvnpt Nguyễn Tất Thắng

    Sao không giải nén được nhỉ? tải về file rỗng.

     
    Lần sửa cuối bởi bạn: 03/07/2016 21:05
  • duongnguyen

    duongnguyen Duong Nguyen

    Cho xin góp 1 viên gạch nhé, đừng chém em tội nghiệp, trong file .tpl các bạn thay bằng code sau sẽ có hiệu ứng 3d theo trục X hoặc Y chỉ cần thay <div class="rotate y"> bằng <div class="rotate x">

    code tpl như sau, anh em chỉnh sửa cho mượt hơn:

    <!-- BEGIN: main -->
    <style type="text/css">
    ul.weblinks{padding:0; margin:0}
    ul.weblinks li{width:50%;float: left;}
    ul.weblinks li div{padding:0px;}
    ul.weblinks li a{display:block;text-align:center;width:100%}
    ul.weblinks li a img{max-width:100%;text-align:center;border:1px #777 solid;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
    
    div.flip{
    	position:relative;
    	width: 110px; /* Set default width of flip */
    	height: 80px; /* Set default height */
    	-webkit-perspective: 600px; /* larger the value, the less pronounced the 3D effect */
    	-moz-perspective: 600px;
    	-o-perspective: 600px;
    	perspective: 600px;
    }
    
    div.flip div.rotate{
    	width: 100%;
    	height: 100%;
    	-moz-transform-style: preserve-3d; /* Specify all child elements inside this DIV maintain the same perspective */
    	-webkit-transform-style: preserve-3d;
    	-o-transform-style: preserve-3d;
    	transform-style: preserve-3d;
    	-moz-transition: all 0.6s ease-in-out 0.3s; /* final 0.3s specifies delay before effect kicks in */
    	-webkit-transition: all 0.6s ease-in-out 0.3s;
    	-o-transition: all 0.6s ease-in-out 0.3s;
    	transition: all 0.6s ease-in-out 0.3s;
    }
    
    div.flip div.rotate > *{ /* Target all children elements */
    	position:absolute;
    	width: 100%;
    	height: 100%;
    	-moz-backface-visibility: hidden;
    	-webkit-backface-visibility: hidden;
    	-o-backface-visibility: hidden;
    	backface-visibility: hidden;
    }
    
    div.flip div.rotate > div{ /* Target all child DIVs */
    	-webkit-box-sizing: border-box; /* Specify that any border/ paddings do not add to the DIV's total width */
    	-moz-box-sizing: border-box;
    	box-sizing: border-box;
    	padding: 8px;
    	background: #eee;
    }
    
    div.rotate.x *:nth-child(2){ /* X Axis rotate specific CSS. Rotate 2nd child DIV 180deg in the X axis */
    	-moz-transform: rotateX(180deg);
    	-webkit-transform: rotateX(180deg);
    	-o-transform: rotateX(180deg);
    	transform: rotateX(180deg);
    }
    
    div.flip:hover > div.rotate.x{ /* X Axis rotate specific CSS. Rotate div.rotate.x when mouse rolls over container */
    	-moz-transform: rotateX(180deg);
    	-webkit-transform: rotateX(180deg);
    	-o-transform: rotateX(180deg);
    	transform: rotateX(180deg);
    }
    
    div.rotate.y *:nth-child(2){ /* Y Axis rotate specific CSS. Rotate 2nd child DIV 180deg in the Y axis so it mirrors the first */
    	-moz-transform: rotateY(180deg);
    	-webkit-transform: rotateY(180deg);
    	-o-transform: rotateY(180deg);
    	transform: rotateY(180deg);
    }
    
    div.flip:hover > div.rotate.y{ /* Y Axis rotate specific CSS. Rotate div.rotate.y when mouse rolls over container */
    	-moz-transform: rotateY(180deg);
    	-webkit-transform: rotateY(180deg);
    	-o-transform: rotateY(180deg);
    	transform: rotateY(180deg);
    }
    </style>
    <div class="clearfix">
    	<ul class="weblinks">
    	<!-- BEGIN: loop -->
    		<li style="margin-bottom:-20px;">	
    			<div class="flip" style="display: inline-block; margin-right: 10px">
    				<div class="rotate y">
    					<a href="{LOOP.url}" title="{LOOP.title}"><img src="{LOOP.urlimg}"></a>
    					<a href="{LOOP.url}" title="{LOOP.title}"><img src="{LOOP.urlimg}"></a>
    				</div>
    			<div>
    		</li>
    	<!-- END: loop -->
    	</ul>
    </div>
    <!-- END: main -->

     

     
  • phavaphu

    phavaphu Phạm Văn Phương

    Sao bật kéo thả block thì nó bình thường

    Tắt kéo thả block thì nó hiện lên bị thuyết chỗ vậy các bác?

    Xin hướng dẫn chắc phục giúp với!

     

     
    ductrung thích điều này.
  • Ảnh không đều nhau rồi. Sharer clearfix 2 cột giúp bác ấy đi.

     
  • phavaphu

    phavaphu Phạm Văn Phương

    Cảm ơn bác! Nhờ hướng dẫn của bác Tứ đã xử lý xong rồi bác! :)

     
  • sinpink

    sinpink Trương Thành Tâm

    lỗi page isn’t working sửa thế nào các bạn

     

Chia sẻ trang này

Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây