[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.

  • 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.
  • Hay quá anh :D này dùng làm block đối tác được hì

     
  • trungnghiack

    trungnghiack trung nghia

    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
  • Furrionoup

    Furrionoup zvusafme2tructuGP szusafme3meidrzGP

    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ỉ

     
  • Edelbrockaiv

    Edelbrockaiv zzusaymezmayxksGP zvusaymextbmzwuGP

    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
  • Yamahayuv

    Yamahayuv zwusalmeltfqdxdGP zzusafme2ntkdkxGP

    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
  • 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 -->

     

     
  • 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.

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

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

     
  • Bản nv 4.0.29 không được bạn ơi

     

     

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