.animate()
Định nghĩa và sử dụng .animate()thực hiện một hình ảnh động (animate) tùy chỉnh của một tập hợp các thuộc tính css. .animate() được sử dụng rất nhiều, trong việc tạo ra hiệu ứng chuyển động. .animate(Thuộc tính,option) Cấu trúc $(‘.test’).animate({ opacity: 0.25, left: “+=50″ }, 5000); Html viết: <!DOCTYPE HTML> <html> <head> <meta charset=”utf-8”> <title>Tiêu […]
.show()
Định nghĩa và sử dụng .show()hiện thành phần phù hợp. Thành phần sẽ được hiện giống như được sử dụng style=”display: block;” .show() Cấu trúc $(‘p’).show(); Html viết: <!DOCTYPE HTML> <html> <head> <meta charset=”utf-8″> <title>Tiêu đề</title> <script src=”https://code.jquery.com/jquery-latest.js”></script> <style> div { background-color: blue; height: 100px; width: 100px; } </style> <script> $(function(){ $(‘div’).hide(); $(‘button’).click(function(){ $(‘div’).show(); }); }); […]
.hide()
Định nghĩa và sử dụng .hide()ẩn thành phần. Thành phần sẽ được ẩn giống như được sử dụng style=”display: none;”. .hide() Cấu trúc $(‘p’).hide(); Html viết: <!DOCTYPE HTML> <html> <head> <meta charset=”utf-8″> <title>Tiêu đề</title> <script src=”https://code.jquery.com/jquery-latest.js”></script> <style> div { background-color: blue; height: 100px; width: 100px; } </style> <script> $(function(){ $(‘button’).click(function(){ $(‘div’).hide(); }); }); </script> </head> <body> […]
.toggleClass()
Định nghĩa và sử dụng .toggleClass()thêm hoặc loại bỏ một hoặc nhiều class của thành phần. Việc thêm hoặc loại bỏ class được luân phiên nhau giữa các lần action (VD action Click). .toggleClass(tên class) Cấu trúc $(‘p’).toggleClass(‘test’); Html viết: <!DOCTYPE HTML> <html> <head> <meta charset=”utf-8″> <title>Tiêu đề</title> <script src=”https://code.jquery.com/jquery-latest.js”></script> <style> p { cursor: pointer; […]
.toggle()
Định nghĩa và sử dụng .toggle()hiển thị và ẩn các thành phần phù hợp. Việc hiển thị và ẩn được luân phiên nhau giữa các lần action (VD action Click). .toggle(độ bền) Cấu trúc Độ bền có thể bằng số hoặc bằng chữ: slow, fast. $(‘p’).toggle(300); $(‘p’).toggle(fast); Html viết: <!DOCTYPE HTML> <html> <head> <meta charset=”utf-8″> […]
.slideToggle()
Định nghĩa và sử dụng .slideToggle()hiển thị và ẩn các thành phần phù hợp với hiệu ứng chuyển động trượt (slide). .slideToggle() được ứng dụng để tạo menu slide, khi click hoặc hover thì menu con sẽ luân phiên slide lên xuống, hoặc có thể dùng để tạo accordion. .slideToggle(độ bền) Cấu trúc Độ bền […]
.slideUp()
Định nghĩa và sử dụng .slideUp()ẩn các thành phần phù hợp với hiệu ứng chuyển động trượt (slide). .slideUp() được ứng dụng để tạo menu slide, khi click hoặc hover thì menu con sẽ slide lên, hoặc có thể dùng để tạo accordion. .slideDown(độ bền) Cấu trúc Độ bền có thể bằng số hoặc bằng chữ: […]
.slideDown()
Định nghĩa và sử dụng .slideDown()hiển thị các thành phần phù hợp với hiệu ứng chuyển động trượt (slide). .slideDown() được ứng dụng để tạo menu slide, khi click hoặc hover thì menu con sẽ slide xuống, hoặc có thể dùng để tạo accordion. .slideDown(độ bền) Cấu trúc Độ bền có thể bằng số hoặc bằng […]
.fadeToggle()
Định nghĩa và sử dụng .fadeToggle()làm hiển thị (display: block;) hoặc biến mất (display: none;) thành phần kèm với hiệu ứng làm mờ (opacity). .fadeToggle() được ứng dụng trong menu, khi hover sẽ xuất hiện hoặc ẩn menu con. .fadeToggle(độ bền) Cấu trúc Độ bền có thể bằng số hoặc bằng chữ: slow, fast. $(‘p’).fadeToggle(400); $(‘p’).fadeToggle(‘fast’); […]
.fadeOut()
Định nghĩa và sử dụng .fadeOut()ẩn các thành phần phù hợp với hiệu ứng mờ dần (fade). .fadeOut() được ứng dụng trong menu, khi hover sẽ xuất hiện menu con, mouseout sẽ ẩn menu con. .fadeOut(độ bền) Cấu trúc Độ bền có thể bằng số hoặc bằng chữ: slow, fast. $(‘p’).fadeOut(300); $(‘p’).fadeOut(‘fast’); Html viết: <!DOCTYPE HTML> […]
.fadeIn()
Định nghĩa và sử dụng .fadeIn()hiển thị các thành phần với hiệu ứng rõ dần (fade in). .fadeIn() được ứng dụng trong menu, khi hover sẽ xuất hiện menu con. .fadeIn(độ bền) Cấu trúc Độ bền có thể bằng số hoặc bằng chữ: slow, fast. $(‘p’).fadeIn(300); $(‘p’).fadeIn(‘fast’); Html viết: <!DOCTYPE HTML> <html> <head> <meta charset=”utf-8″> <title>Tiêu […]
.height()
Định nghĩa và sử dụng .height()xác định hoặc gán giá trị chiều cao (height) cho thành phần. .height() được ứng dụng rất nhiều, như việc xác định chiều cao của window, hay thành phần, hoặc chỉnh chiều cao 2 thành phần cho bằng nhau. .height() Cấu trúc Xác định giá trị chiều cao của thành phần. […]