Không có bình luận nào trên trang cá nhân.
Xem bình luận trên trang cá nhân >>
Không có tin nhắn mới.
Xem tin nhắn >>
Email :
Mật khẩu :
Ghi nhớ?
Quên MK
Login với
Tài khoản của bạn
Chỉnh sửa thông tin
Thay đổi mật khẩu
Quản lý Bài Công nghệ
Quản lý Bài Tin Tức
Thoát
Điểm nhấn
Xử lý răng cưa khi tách nền nhanh trong photoshop
Hướng dẫn tự động đăng nhập facebook với Selenium
Hướng dẫn tải tệp CSV vào Colab
Hướng dẫn phân loại văn bản tiếng Việt sử dụng machine learning
Một số dòng lệnh linux command hữu ích dành cho dân data scientist
Split file thành nhiều file nhỏ hơn bằng linux
Đóng góp
Viết bài Công nghệ
Viết bài Tin tức
Gửi Sách
Gửi Phần mềm
Gửi Mail
Liên hệ
 
DOTNET
Windows Form
WPF
Console
ASP.NET
ASP.NET MVC 2
ASP.NET AJAX
Class Library
Silverlight
WCF
DotNetNuke
Crystal Report
SharePoint
LightSwitch
.NET Framework
.NET Base Class Library
Regular Expressions
XML
Chart Controls
Azure
LINQ to SQL
Microsoft Office
Office Live Development
Team Foundation Server
Maps
ADO
Control
Tips
Config
Facebook Apps
Visual Studio 2012
Windows Phone
React Native
Xem tất cả
JAVA
Applet
Swing/JFC/AWT/SWT
Network
J2ME
J2SE
J2EE
Web Service và XML
Portal
Android
Other
C/C++
IOS
PHP
VBB
JOOMLA
WDPRESS
DRUPAL
NUKEVIET
ZEND
CAKE PHP
MVC
MAGENTO
LINUX
WEBSERVER
OTHER
Moodle
DATABASE
MySQL
Tip
SQL Server
Guide
ĐÀO TẠO
Compare
Guide
Introduction
Install
SEO
Project
GRAPHICS
MMO
IoT
Python
Linux
Photoshop
SÁCH
PHẦN MỀM
TIN TỨC
SEO
Learning SEO
SEO On-Page
Thủ thuật SEO
Phần mềm SEO
Thuật ngữ
TIẾNG ANH
Thủ thuật
Hướng dẫn chuyển đổi định dạng HEIC sang JPG
Hướng dẫn tải sách không tốn phí trên Amazon
Hướng dẫn xài mãi mãi StarUML
Trang chủ
HTML
Cấp bậc tác giả:
HTML
Hướng dẫn làm chữ, ảnh chuyển động mượt mà, nhẹ nhàng
Được viết bởi
webmaster
vào
ngày 21/07/2015 lúc 02:07 PM
Bài này giúp sử dụng thuần thục JS giúp chuyển động chữ hoặc ảnh giống như marquee
0
5599
Tải tệp tin:
Click ở đây
Hướng dẫn làm chữ, ảnh chuyển động mượt mà, nhẹ nhàng
Demo Online
Bước 1:
Tải
MetroJs.min.css
Tải
jquery-1.8.3.min.js
Tải
MetroJs.min.js
Bước 2:
Copy Dòng này vào trong BODY
<head>
<link
href
="
MetroJs.min.css
"
rel
="
stylesheet
"
type
="
text/css
">
</head>
<body>
<div>
<ul
class
="
live-tile
"
data-speed
="
300
"
data-delay
="
2000
"
data-mode
="
carousel
">
<li>
<img
src
="
http://dct.udn.vn/../Upload/LienKet/290814094356doan_s3.png
"
alt
="">
</li>
<li>
<img
src
="
http://dct.udn.vn/../Upload/LienKet/030914075233cong-nghe.png
"
alt
="" >
</li>
</ul>
</div>
<script
src
="
jquery-1.8.3.min.js
"
type
="
text/javascript
">
</script>
<script
src
="
MetroJs.min.js
"
type
="
text/javascript
">
</script>
<!-- END PAGE LEVEL PLUGINS -->
<!-- BEGIN CORE TEMPLATE JS -->
<script
type
="
text/javascript
">
$(document).ready(function () {
$(".live-tile,.flip-list").liveTile();
});
</script>
</body>
Chú ý:
Để ảnh qua trái:
data-direction
=
"horizontal"
Để ảnh lật:
data-mode
=
"flip"
Để ảnh nằm trong ô vuông và lật ảnh:
data-mode
=
"flip-list"
Xem thêm tại đây: http://www.drewgreenwell.com/projects/metrojs
Nguồn bài viết:
DOTNET.VN
Bài trước
Tự động cuộn nội dung với JS
Bài sau
Upload và download tập tin Word từ cơ sở dữ liệu
Bài viết tương tự
Một số Slide hình ảnh tin tức tuyệt vời dành cho Web
Tự động cuộn nội dung với JS
Hướng dẫn làm Slide với style CSS3
Hiệu ứng zoom ảnh với CSS3
Hiển thị tất cả cookie sử dụng Javascript
Responsive Navigation Menu sử dụng Twitter Bootstrap 3.0
[HTML5]Web Form 2.0
[HTML5]Sự kiện
[HTML5]Thuộc tính
[HTML5]Cú pháp
BÌNH LUẬN BÀI VIẾT
Bài viết mới nhất
Hướng dẫn hiển thị danh sách dạng List ra Repeater
Làm thế nào Hover với Bootstrap Dropdown
Hướng dẫn chuyển đổi ngày Âm - Dương trong Excel
Tìm hiểu về cách hoạt động của Bootstrap Grid 4
Xử lý răng cưa khi tách nền nhanh trong photoshop
Hướng dẫn tự động đăng nhập facebook với Selenium
Hướng dẫn tải tệp CSV vào Colab
Hướng dẫn phân loại văn bản tiếng Việt sử dụng machine learning
Một số dòng lệnh linux command hữu ích dành cho dân data scientist
Split file thành nhiều file nhỏ hơn bằng linux
Xem tất cả
LIKE BOX
Bài viết được xem nhiều nhất
LẤY LẠI MẬT KHẨU SA TRONG SQL SERVER 2005 2008 (77176)
Một số bài tập mẫu SQL(Phân I) (70003)
[TUT]Xây dựng Website Bán Hàng - Hướng dẫn tạo DataBase (68405)
CSS cho các thẻ theo trạng thái (link, hover, visited, active, focus) (63373)
Các kiểu dữ liệu SQL (62763)
Chuyển đổi giữa các hệ cơ số (60723)
Kiểu dữ liệu Array và List trong C# (57731)
Xây dựng Lớp Phân Số. Tính toán Cộng, trừ, nhân, chia (46608)
Hướng dẫn khắc phục lỗi không tạo được Diagrams(sơ đồ quan hệ) trong SQL 2005/2008 (33893)
[Java] Kết nối CSDL từ NetBean (28831)
Xem tất cả
HỌC HTML
1
Làm thế nào Hover với Bootstrap Dropdown
2
Tìm hiểu về cách hoạt động của Bootstrap Grid 4
3
Hướng dẫn xây dựng đồng hồ bấm giờ bằng JavaScript
4
Hướng dẫn sử dụng CSS Flexbox - Phần 2
5
Hướng dẫn sử dụng CSS Flexbox - Phần 1
6
Cài đặt CLI cho môi trường vue chuyên nghiệp hơn
7
Cài đặt Vue thông quan NPM
8
Dùng cặp thẻ script trực tiếp để sử dụng thư viện Vue.js
9
Cài đặt Vue Devtools
10
Phần 11 CSS3 - Sử dụng Sass
Xem tất cả
Học Hệ thống Mạng
Hướng dẫn Cấu hình DHCP và Routing Remote Access
Hướng dẫn tạo Organizational Unit - Domain Group & User - Join Domain
Nghẽn băng thông mạng LAN
Cisco Meraki - Kiến trúc hạ tầng mạng tiên tiến có một không hai
Hướng dẫn chia sẻ dữ liệu giữa máy thật và máy ảo trên VirtualBox
Hướng dẫn cách copy và paste giữa máy thật và máy ảo trên VirtualBox
Phần mềm tạo máy ảo miễn phí và tốt nhất hiện nay
Lỗi Hyper-V khi cài đặt VMware Workstation trên Windows 8
Khoá không cho Người dùng thay đổi địa chỉ IP
VMWARE báo 'VmWare remote file system 2gb limit'
Xem tất cả