Laptop AI lên ngôi: Lý do người dùng nên nắm bắt ngay từ bây giờ
BookBlock: A Content Flip Plugin
BookBlock là một plugin jQuery mà có thể được sử dụng để tạo ra các thành phần giống như cuốn sách nhỏ cho phép một 'lật trang' chuyển hướng. Nội dung có thể được sử dụng như hình ảnh hoặc văn bản. Các plugin biến đổi cấu trúc chỉ khi cần thiết (tức là khi lật một trang) và sử dụng một số lớp phủ như bóng cho các trang để tạo ra hiệu ứng.
Chúng tôi sẽ sử dụng jQuery++ bởi Bitovi đó có một số tiện ích cho jQuery (cụ thể, để thêm sự kiện swipe).
Cấu trúc sau đây sẽ cho phép để thêm nội dung tùy chỉnh trong một wrapper với các lớp học 'item-cf', đại diện cho một trang mở (bên trái và bên phải):
<div id='bb-bookblock' class='bb-bookblock'> <div class='bb-item'> <!-- custom content --> </div> <div class='bb-item'> </div> <div class='bb-item'> <!-- ... --> </div> <div class='bb-item'> <!-- ... --> </div> <!-- ... --></div>
Bạn có thể gọi plugin :
$(function() { $( '#bb-bookblock' ).bookblock(); });
Một số tùy chỉnh khác :
// speed for the flip transition in ms.speed : 1000, // easing for the flip transition.easing : 'ease-in-out', // if set to true, both the flipping page and the sides will have an overlay to simulate shadowsshadows : true, // opacity value for the 'shadow' on both sides (when the flipping page is over it).// value : 0.1 - 1shadowSides : 0.2, // opacity value for the 'shadow' on the flipping page (while it is flipping).// value : 0.1 - 1shadowFlip : 0.1, // perspective valueperspective : 1300, // if we should show the first item after reaching the end.circular : false, // if we want to specify a selector that triggers the next() function. example: '#bb-nav-next'.nextEl : '', // if we want to specify a selector that triggers the prev() function.prevEl : '', // callback after the flip transition.// page is the current item's index.// isLimit is true if the current page is the last one (or the first one).onEndFlip : function( page, isLimit ) { return false; }, // callback before the flip transition.// page is the current item's index.onBeforeFlip: function( page ) { return false; }
Bạn có thể hiểu rõ thêm khi xem Demo.
TIN LIÊN QUAN
Creative Web Typography Styles
Với một chút CSS ma thuật, chúng ta có thể chuyển đổi văn bản vào kiểu chữ rất đẹp và bỏ qua việc sử dụng các hình ảnh trong nhiều trường hợp
Fullscreen Video Slideshow with BigVideo.js
Chúng tôi sẽ hưỡng dẫn làm thế nào để tạo slideshow nền bằng video động hoặc một slider bằng Bigvideo.js một Plugin JQuery khá đẹp
Photo Booth Strips with Lightbox
Băng ảnh đứng đẹp mắt với Lightbox 2 di chuyển bằng cách lăn bi với phong cách lạ với 'Photo Booth Strips with Lightbox'
Old School Cassette Player with HTML5 Audio
Vintage định dạng đáp ứng công nghệ web hiện đại: máy nghe nhạc âm thanh HTML5 với các điều khiển thực tế. Hôm nay chúng tôi muốn chia sẻ một máy nghe nhạc âm thanh với giao diện trông giống như một băng nhạc trường học cũ.
THỦ THUẬT HAY
Hướng dẫn bạn 2 cách Reset điện thoại Android bằng máy tính
Xử lý thế nào khi điện thoại Android của bạn bị đầy bộ nhớ, bị treo hoặc trục trặc? Giải pháp tốt nhất là thực hiện khôi phục cài đặt gốc trên điện thoại của bạn để đưa điện thoại trở lại cài đặt ban đầu và dưới đây là
Hướng dẫn các bỏ thông báo yêu cầu bản quyền trên Windows 10
Đối với hệ điều hành Windows 10, nếu người dùng không kích hoạt bản quyền Windows thì ở góc phải màn hình luôn luôn xuất hiện một thông báo yêu cầu bản quyền.
Cách nhận biết khi Gmail đã bị xâm nhập và biện pháp phòng chống
Với thông tin tin tặc có thể xâm nhập Gmail với tỷ lệ thành công 92%, người dùng Gmail đang tự hỏi làm thế nào để biết email của họ đã bị hack, và phải làm gì trong trường hợp đó. Và dưới đây là cách bạn có thể biết ai
Minima Live Walllpaper: ứng dụng ảnh nền độc đáo, thu hút mọi ánh nhìn
Đây là ứng dụng miễn phí, cung cấp khá nhiều ảnh nền động 3D đẹp mắt theo chủ đề tối giản với những đường kẻ dọc ngang đầy màu sắc. Do là ảnh 3D nên sẽ chuyển động khi bạn xoay máy và còn có hiệu ứng làm phẳng ảnh khi
Home New Tab Page: Tiện ích mở rộng thiết kế đẹp và tích hợp nhiều tính năng hữu ích dành cho Chrome
Hôm nay, TCn xin chia sẻ với các bạn một tiện ích mở rộng khá hay dành cho trình duyệt web Google Chrome (hoặc Cốc Cốc), sở hữu thiết kế đẹp mắt, tích hợp nhiều tính năng hữu ích và đặc biệt là có thể thực hiện một số
ĐÁNH GIÁ NHANH
Bút S Pen trên Galaxy Note 8: viết sướng hơn và vui vẻ hơn
Cây bút mới giờ đây viết mượt và chính xác hơn, cảm giác thực hơn nhờ đầu bút được làm nhỏ chỉ 0,7mm. Samsung cũng bổ sung thêm chức năng cắt video thành ảnh GIF và vẽ ảnh GIF để gửi cho bạn bè, ngon nhất là hỗ trợ gửi
Lenovo Z5s chính thức ra mắt: Màn hình giọt nước, chip SD 710, 3 camera sau, giá 4.7 triệu
Không giống như Samsung Galaxy A8s và Huawei Nova 4, Lenovo Z5s sở hữu màn hình “giọt nước” để chứa camera selfie của máy.
Trải nghiệm và đánh giá nhanh Camera Galaxy A6+
Để có thể đưa ra nhận định tương đối sâu sát về cụm camera trước lẫn sau trên Galaxy A6/A6+, mình đã chụp kết hợp nhiều điều kiện ánh sáng khác nhau trong khi lang thang đường phố Sài Gòn, từ đủ sáng, chênh sáng, ánh