In this article, you will see how to implement Lifehacker.com or Gizmodo.com style sidebar which scrolls independently on mouseover with mouse wheel. It’s really interesting to show important things in top of sidebar. When any user reads articles(might not focus on sidebar instantly), reaches end of article but there is no change in sidebar position. It’s good and a chance to make attention on sidebar, otherwise sidebar is also moving along with article and top section of sidebar is not focused. …
In my recent posts, You’ve seen how to Make the Website Mobile, Tablet, Desktop Compatible and Test Responsive Web Design. In this post, you’ll see different ways to design responsive navigation menu.
…
You must know Zen Coding if you are Front End Web developer. Zen coding allows for fast coding and editing in HTML, XML, XSL, and other structured code formats. It uses CSS selectors like syntax and generate full code(write less do more). It expands abbreviations into complete HTML structures. Zen coding plugin is available for almost all top text editors(Notepad++, visual studio, Dreamweaver , TextMate, Sublime Text, Coda, Vim ..etc). In live demo, First write abbreviations and press Ctrl+, to expand abbreviations.
…
My previous post explains basic steps for responsive web design to make the site mobile, tablet and desktop compatible. Now, we have to test the website in different resolutions. You can test it simply by resizing browser window, but It’s not convenient resizing to a specific dimension(width and height) each time. Here are tools or utilities to test effectively. …
Every client wants their website compatible with all platforms, whether user is accessing the site on a mobile phone, tablet, desktop computer or wide-screen. There are so many devices BlackBerry, iPhone, iPad, netbook, kindle..etc with different sizes and resolutions. It’s impossible to create a website version for each resolution. With Responsive Web Design technique, the website adapts the layout to the environment that it is being viewed in. It makes similar feelings for all platforms. You can see TechBrij as an example by resizing the browser window if you are on a desktop.
…
It’s easy to group data in SQL statement, but if you have to display it using HTML table, It’s not drag and drop as in reporting environment. One way to group on server side and draw tr td accordingly. But If it is already created with tons of functionality attached, It’s risky to change. Don’t worry, you can do it easily with jQuery. …
In this article, we’ll implement month range selection feature in which user can select start and end months to get monthly data and we don’t want to add one more external library for this if jQuery UI is already being used in the project. We’ll use jQuery UI date-picker to show month and year only to select month range. …
If you are using Google custom search engine for your website and want to add Facebook like button in every search result. See following steps to implement this. Assuming you are familiar with basic HTML ,CSS and Javascript.
…
Generally, A Web developer or designer want to search in his/her favorite sites first, but too complex to search in individual site one by one. Being a Front-End developer, I decided to create a search engine based on top sites, forums and blogs for HTML, CSS, Javascript and jQuery. After NetBrij(A Search engine for .NET developers), BrijPad(An online text editor for fast development), The next is FEDe (free from ‘Brij’ keyword 
). It’s a search engine for Front-End (HTML, CSS, Javascript & jQuery) Web developers based on Google CSE.
…
This article explains how to implement custom date range picker to select year, month or quarter only (Generally used in reporting) and get start date and end date of user selected value. We will use daterangepicker jQuery-Plugin by filamentgroup. I see jQueryUI DatePicker but it’s little bit complicate. …
In my Online Bus Reservation System project, I got queries from many people about how to implement seat selection screen effectively. So, I decided to write on it. This post explains how to implement seat booking with jQuery. It can be used in online Bus, flight, hotel, exam support, cinema and ticket booking system.
…
I see there are a lot of jQuery popups. Mostly work on link navigation means when you click on link then it will show popup. Suppose you want to show popup on button click then here is the simple trick to do this. I take fancybox jquery popup for example. This will call ajax.php. For this, I take a link,set display none and trigger it on button click. …
A wizard is a sequence of dialog boxes to guide users. It’s more convenient to perform complex UI tasks which has more conditional controls depends on user input. This article will show you to implement wizard with jQuery.
…
It explains How to create a sidebar or section that follows you as you scroll down the page. It is very useful to show special or important content to user. …
