Make Checkboxes Act Like Radio Buttons Using jQuery

This tutorial shows you how to make Check boxes act like radio buttons, this really need when the designer designed a quiz page with check boxes instead of radio buttons and the client wants only in that way. Sad isn’t it?

But don’t worry here is the solution for that,
jQuery Part:

Simple Image Scroll Using Javascript Marquee

Simple image scroll using javascript marquee, only with the help of jQuery and marquee.js. Only need to add the javascripts and the scrolling div. This script will only output a div with a number of images scrolling inside it. You can add more functionality to it later as per your need.

Then you need to add the css for image container and the images,

That’s it. You have integrated your scroll. You can download the attached zip file which contains the html and js files here.

Scroll To Specific Section Using jQuery

We can scroll to specific section using jQuery method .scrollTop(). .scrollTop() expects a parameter, that is , the pixel value where the scroll bar should scroll to.

is able to scroll the window ( if there is enough content in it ). You can also get desired value with offset() and position().

This will scroll the contact element to view. The non-jQuery alternate method is .scrollIntoView(). You can call that method on any DOM element like:

true indicates that the element is positioned at the top whereas false would place it on the bottom of the view. The nice thing with the jQuery method is, you can even use it with functions like .animate(). So you might smooth scroll something.

you can use a very lightweight approach by defining your custom scroll jquery function.

Scroll to a page using coordinates,

scrolling with window.scroll,

only to sum up, use the window.location.hash to jump to element with ID,

Happy Coding 🙂

Live URL Of jQuery UI Themes

jQuery UI is a JavaScript library that provides abstractions for low-level interaction and animation, advanced effects and high-level, themeable widgets, built on top of the jQuery JavaScript library, that can be used to build interactive web applications.

You need to add the jQuery.ui.js file to enable your UI integration. And for the styles you need to include ui.css files. Switching with the themes is little difficult you you are downloading the files from the jQuery.ui site and including it to your html page.

A more easy way is there to play with all the themes provided by jQuery.ui without downloading all of them. Below are the live urls of the ui.css files for all the themes. Just put these urls in your scripting include and the ui theme for whole site will be changed and you can see the reflection at that instance.

Script to include your JS files to enable jQuery and jQuery UI Themes for your site,

<script type=”text/javascript” src=””></script>

<script type=”text/javascript” src=””></script>

Now add you css file for UI CSS. The url should be chnaged to change the UI theme,

<link rel=”stylesheet” type=”text/css” href=”DYNAMIC URL HERE” media=”screen” />

Now find below your desired theme and place that URL into the above code.



























All the css can be managed in the database also and you can have a nice UI theme chnager option for your site. I hope this post will help will somewhat.