Tuesday, February 26, 2013

IT Show 2013

Back then all the major IT events in Singapore were hosted at either Singapore Expo or Suntec City Mall. However this time round, they have moved to a new location and that would be...

'Marina Bay Sands'.
Details of the event are as follows:
Date: 7 - 10 March 2013
Venue: Levels 1 & B2
            Marina Bay Sands
Opening Hours: 12noon - 9pm

By the way, from now till 25 Feb 2013, visit the IT Show Facebook page and you could win either one of the 2 iPad Minis or a 13" MacBook Air. For each successful referral, you will get additional chance to win one of the prizes. :P

* Click here to find out more about 'IT Show 2013'.
^ Click here to find out more about 'Marina Bay Sands'.
~ Click here to visit the 'IT Show Facebook page'.

Saturday, February 23, 2013

JQuery: Irritating button gap...

I was working on Javascript and JQuery the other day and I have came across this strange button gap between a button set, which is kinda annoying. After spending some time playing around it, I finally could come up with a workaround for this annoying problem.

Main HTML file - index.html
<!doctype html>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>JQuery Buttons</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">
 <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
 <link rel="stylesheet" href="css/index.css">
    <script src="js/index.js"></script>
  <input name="grp0" type="radio" id="btn0" />
  <label for="btn0">Button 0</label>
  <input name="grp0" type="radio" id="btn1" />
  <label for="btn1">Button 1</label>
  <input name="grp0" type="radio" id="btn2" />
  <label for="btn2">Button 2</label>
  <input name="grp0" type="radio" id="btn3" />
  <label for="btn3">Button 3</label>
  <input name="grp0" type="radio" id="btn4" />
  <label for="btn4">Button 4</label>
  <input name="grp0" type="radio" id="btn5" />
  <label for="btn5">Button 5</label>
 <section class="btns">
  <input name="grp1" type="radio" id="btns0" />
  <label for="btns0">Button 0</label>
  <input name="grp1" type="radio" id="btns1" />
  <label for="btns1">Button 1</label>
  <input name="grp1" type="radio" id="btns2" />
  <label for="btns2">Button 2</label>
  <input name="grp1" type="radio" id="btns3" />
  <label for="btns3">Button 3</label>
  <input name="grp1" type="radio" id="btns4" />
  <label for="btns4">Button 4</label>
  <input name="grp1" type="radio" id="btns5" />
  <label for="btns5">Button 5</label>

Main CSS file - css/index.css (The magic is done here... :P)
@charset "utf-8";
/* CSS Document */



.btns .ui-button{
    margin-left: 0;
    margin-right: -4px;

Main Javascript file - js/index.js
$( document ).ready(function() {
 $( "section input[type='radio']" )
});// JavaScript Document
* Click here for the demo shown in this post.
^ Click here for the source files for the demo.