Trong bài viết 5 jQuery Plugin về thanh cuộn, mình có đề cập đến jScrollPane. Trong bài viết lần này, mình sẽ hướng dẫn các bạn cách sử dụng thanh cuộn (Scrollbar) với jScrollPane.

Chi tiết

jQuery đã và đang trở thành một công cụ rất hữu dụng cho các nhà thiết kế web. Một trong những thành công là tạo ảnh trượt (gallery, slideshow, carousel...). Hôm nay mình sẽ giới thiệu tới các bạn vài plugin mà bạn nên tham khảo khi dự định tạo một slideshow của riêng mình.

Chi tiết

Không thể phủ nhận một dự án website mà không cần đến jQuery. Chỉ trong ba tháng của năm 2012, những plugin, hiệu ứng jQuery phát triển nhanh. Hôm nay, Y2Graphic tổng hợp được một số jQuery nổi bật, ứng dụng nhiều trong việc thiết kế website. Mời các bạn theo dõi.

Chi tiết

Chúng ta đều biết tầm quan trọng của form trong một trang web. Tuy nhiên , dạo quanh một vòng Google, mình thấy khá nhiều form của một vài website vẫn chưa đạt được mục đích. Bài viết này sẽ đưa ra một vài plugin nhằm có thể tối ưu hoá form. Mời các bạn theo dõi.

Chi tiết

jQuery chính là một thư viện kiểu mới của Javascript giúp đơn giản hóa cách viết Javascript và tăng tốc độ xử lý các sự kiện trên trang web. Không thể phủ nhận, jQuery giúp các nhà phát triển đơn giản hóa những dòng lệnh của Javascript và giúp người truy cập web cảm thấy thích thú bởi những hiệu ứng của nó mang lại. Trong bài viết, cùng xem qua 10 Plugin mà chúng tôi tổng hợp. Đó là những Plugin có thể giúp ích trong việc phát triển web của bạn đó

Chi tiết

Trong những năm gần đây, xu hướng sử dụng kỹ thuật Sider ngày càng phổ biến trong thiết kế website. Nếu bạn đang có ý định sử dụng chúng trong trang web, hãy tham khảo 10 hiệu ứng dưới đây để tạo ra Sider.

Chi tiết

Công dụng của thanh cuộn (Scrollbar) là để cuộn nội dung hoặc trang web khi vượt quá chiều cao cho phép. Tuy nhiên, trong vài trường hợp thiết kế layout, chúng ta muốn thay thế thanh cuộn mặc định của trình duyệt bằng thanh cuộn đầy màu sắc thì bạn hãy tham khảo 10 jQuery plugins về thanh cuộn.

Chi tiết

Menu là một yếu tố quan trọng trong thiết kế web. Vì thế, hôm nay Y2Graphic sẽ giới thiệu cho các bạn những JQuery menu đẹp mắt. Nếu bạn đang tìm một menu đẹp kèm hiệu ứng bắt mắt thì bạn không thể bỏ qua bài viết lần này.

Chi tiết

Tooltip rất phổ biến trên nhiều trang web bởi vì nó giúp bạn tiết kiệm nhiều khoảng trông trên trang web để dành cho những thông tin quan trọng hơn. Đa phần Tooltip được dùng để cung cấp thông tin bổ sung cho một đối tượng nào đó. Trong bài viết ngày hôm nay, Y2Graphic cung cấp cho các bạn một số jQuery Tooltip hữu dụng.

Chi tiết

Lightbox là một dạng cải tiến từ popup. Nó giống Popup là nó cũng bật ra (pop up), "đè" lên phần còn lại của trang web. Y2Graphic tổng hợp 12 plugin về Lightbox nên dùng khi thiết kế web. Bạn không nên bỏ qua bài viết này vì nó hữu ích cho dự án của bạn. Hãy khám quá.

Chi tiết

Mặc dù là một thư viện javascript xuất hiện khá muộn, jQuery đã nhanh chóng trở nên phổ biến và được sử dụng bởi nhiều lập trình viên web trên thế giới. John Resig, người tạo ra jQuery, làm tạiCambridge, Mass, nói: “jQuery không phải là một framework cỡ lớn tốt nhất trong AJAX – mà cũng không phải là các cải tiến phức tạp vô ích – jQuery được thiết kế để thay đổi cách bạn viết JavaScript.”

Chi tiết

Trong bài viết này tôi sẽ hướng dẫn cách lọc ví dụ trong table mà không cần thay đổi cấu trúc của tài liệu html, cũng như không cần nạp thêm hoặc xóa bỏ dữ liệu. Ý tưởng thực hiện là tôi sẽ ẩn đi tất cả các dòng và chỉ hiển thị các dòng chứa nội dung cần tìm thông qua hai hàm hide() và show(). Nếu muốn có thể hiệu ứng, bạn cũng có thể dùng các hàm fadeOut(), fadeIn().

Chi tiết

Tạo một slide show bằng javascript là một việc không quá phức tạp. Bạn chỉ cần sử dụng setInterval() để định thời gian thực thi một hàm nào đó có nhiệm vụ thay đổi lần lượt các ảnh của một thẻ img. Tuy nhiên, để làm cho ví dụ này phức tạp hơn một chút, ta nên dùng đến sự trợ giúp của jQuery.

Chi tiết

Khi tìm hiểu về CSS tôi tình cờ đọc được một cách làm tooltip rất đơn giản chỉ bằng CSS. Thành phần làm tooltip là một thẻ span được đặt trong các thẻ cần hiển thị tooltip. Mặc định, tooltip sẽ được ẩn đi và chỉ hiển thị khi người dùng di chuyển chuột vào thẻ chứa tooltip (hover). Tuy nhiên, tôi muốn làm cho tooltip này giống trong các ứng dụng trên desktop.

Chi tiết

Bài viết này dùng để tổng hợp các đoạn mã nhỏ (snippet) mà tôi sưu tầm và chỉnh sửa lại để tiện cho việc tham khảo và…copy paste. Một số đoạn mã sử dụng phương pháp tạo plugin cho jQuery, đây là kĩ thuật rất hữu ích mà jQuery cung cấp giúp bạn có thể chia sẻ, tái sử dụng và giúp cho mã nguồn được rõ ràng.

Chi tiết

Cửa sổ popup được tạo ra bao gồm thành phần chính là hai thẻ div. Một thẻ được dùng làm nền với màu xám đục và thẻ còn lại dùng để hiển thị nội dung của popup. Kết hợp với các hiệu ứng chuyển động mà jQuery hỗ trợ, bạn có thể tạo được một popup khá hoàn chỉnh.

Chi tiết

Dựa vào những khả năng lập trình linh hoạt của javascript,  jQuery cho phép lập trình viên tạo ra các plugin để đính kèm vào thư viện chính. Đây là những phương thức được định nghĩa bên ngoài nhưng có thể sử dụng như các phương thức có sẵn của jQuery.

Chi tiết

Turn.js là một plugin của jQuery cho phép tạo hiệu ứng lật trang đẹp mắt với cách thức cài đặt đơn giản và dung lượng nhỏ gọn (chỉ 15KB). Đây có thể là một thư viện được ứng dụng phổ biến để sử dụng cho các trang web đọc sách và các thiết bị cầm tay, thay thế cho các ứng dụng bằng Flash hiện nay.

Chi tiết

Trong ví dụ này tôi sẽ tạo một menu đứng đơn giản bằng cách kết hợp CSS và phương thức/ hiệu ứng slideToggle() của jQuery. Kiểu thiết kế được dựa trên menu của trang codeproject.com.

Chi tiết

Theo lời giới thiệu của trang này (http://www.codecademy.com)  thì đây là “the easiest way to learn how to code”. Trang này sẽ cung cấp một cửa sổ dạng console trên nên web với các dòng hướng dẫn từng bước để bạn làm quen với lập trình. Hơn nữa, trang web này được cung cấp  miễn phí cho người dùng.

Chi tiết

JSONP là viết tắt của Json with padding, đây là kĩ thuật thêm các thẻ script động trong quá trình trang web làm việc, kết hợp với dữ liệu lấy từ server để tạo lời gọi callback khi dữ liệu được tải xong. Việc này giống như việc bạn có thể truyền một hàm từ client đến server. Đây ko phải là Ajax mà chỉ là việc nạp động một đoạn mã javascript từ xa. Đoạn mã này chứa một lời gọi hàm từ chính trang hiện tại và với tham số là dữ liệu json được lấy từ server.

Chi tiết

exeCommand() là một phương thức giúp thực thi các lệnh tương tự trong một trình soạn thảo văn bản. Lệnh được thực thi sẽ tác động đến nội dung hiển thị trên cửa sổ trình duyệt. Đây là phương thức rất hữu ích dùng để tạo ra các HTML Editor hỗ trợ định dạng và chỉnh sửa mã nguồn mà bạn thường gặp trên các trang web.

Chi tiết

Giới thiệu cách thức hoạt động của jQuery và phương pháp để tạo ra một thư viện tương tự. Trước khi đọc bài này, bạn cần có các kiến thức về lập trình hướng đối tượng (OOP) trong javascript và các kiến thức căn bản về jQuery.

Chi tiết

HTML5 cung cấp một tính năng lưu trữ dữ liệu tại client với dung lượng giới hạn lớn hơn nhiều so với cookie.  Tính năng này được gọi là Web Storage và được chia thành hai đối tượng là localStorage và sessionStorage. Bài viết này sẽ giúp bạn nắm được các kiến thức đầy đủ về sử dụng hai đối tượng này trong việc lập trình web.

Chi tiết

Với công nghệ phần cứng hiện nay, việc sử dụng đa luồng đã trở nên một phần không thể thiếu trong các phần mềm. Tuy nhiên, công nghệ thiết kế web vẫn chưa tận dụng được sức mạnh này. Với các công việc đòi hỏi một quá trình xử lý lâu, lập trình viên thường phải sử dụng những thủ thuật như setTimeout(), setInterval(),… để thực hiện từng phần công việc. Hiện nay, để giải quyết vấn đề này, một API mới dành cho javascript đã xuất hiện với tên gọi Web Worker.

Chi tiết

Các kí tự đặc biệt muốn hiển thị trên trình duyệt phải được mã hóa thành các chuỗi đại diện tương ứng. Ví dụ như kí tự “<” sẽ có tên mã tương ứng là < và mã số là <. Các kí tự này được gọi chung là các html entity. Ngoài việc sử dụng trong mã HTML, các entity này còn có thể sử dụng trong javascript và CSS.

Chi tiết

Thông thường để xem một đối tượng có kiểu phức tạp trong javascript, ta thường dùng FireBug hoặc một addon tương tự. Tuy nhiên cách hiển thị các thông tin đối tượng của chúng có thể không theo ý bạn.  Trong bài viết này, tôi sẽ tạo hướng dẫn cách để hiển thị một đối tượng javascript dưới dạng các table lồng nhau tùy theo độ phức tạp của chúng. Phương pháp rất đơn giản, bạn chỉ cần sử dụng đệ quy để kiểm tra kiểu đối tượng, lặp và tạo một table tương tự như công cụ LinqPad thực hiện.

Chi tiết

Muốn tạo ra những hiệu ứng đồ họa đặc biệt khi sử dụng canvas, bạn không thể chỉ sử dụng cá thuộc tính và phương thức có sẵn của đối tượng context. Chính vì vậy, bài viết này sẽ giới thiệu cho bạn cách vẽ ảnh và thao tác với các pixel từ đối tượng ImageData.

Chi tiết

Một ví dụ đơn giản để khi làm quen với đồ họa và chuyển động trong lập trình là viết một ví dụ bóng nảy bên trong một vùng cửa sổ (canvas). Một quả bóng sẽ được vẽ bên trong canvas và chuyển động theo một hướng xác định. Khi chạm bất kì thành tường nào, bóng sẽ đổi hướng chuyển động tùy theo hướng di chuyển.Xem Demo.

Chi tiết

Tiếp theo phần trước, tôi sẽ thêm các chướng ngại vật hình chữ nhật vào canvas để tạo đường di chuyển của trái bóng. Các chướng ngại vật được tôi lấy từ bài: HTML5 – Chọn và di chuyển đối tượng trên Canvas.Xem Demo.

Chi tiết

Bàn phím là thiết bị không thể thiếu và là phương tiện rất quan trọng để thực hiện các chức năng của các ứng dụng tương tác với người dùng. Trong bài viết này, tôi sẽ hướng dẫn cách bắt sự kiện bàn phím trong canvas và dùng nó để điều khiển góc xoay và hướng di chuyển của đối tượng đồ họa.Xem Demo.

Chi tiết

Lên trên đầu