Order of classes in CSS file matter to jQuery?

Its no surprise that jQuery is becoming the latest poison for all Web Developers these days. I am no JavaScript expert, but jQuery makes even a scripting chimp like me to do some cool stuff without writing too much script! I had been playing with this library for some time and came across this small issue which took about an hour of head scratching. In my jQuery, I was adding a hover class to a <div> element. Here is the <div> as in the markup.

<div id="myDiv" class="Sample">
Stuff
</div>

Here is the Sample class


.Sample
{
background-position: 0px -141px;
}
Here is another class which I am going to add with jQuery.

.Sample-hover
{
background-position: 0px -218px;
}

And finally, here is my jQuery,


$('#myDiv').addClass('Sample-hover');

This did not work until I figured out why!!!! In my CSS file the Sample-hover class was declared before Sample class. Due to this, the CSS properties were not being overridden as expected. Phew!! I wished I was a good at these things. Sigh!!


Silverlight z-index not working!

Hahhahaha, I know the answer to this :)). Ok, enough being a jerk. Basically Silverlight would not entertain z-index parameter which is assigned to the object tag until it has a parameter Windowless set to true. Here is a typical object tag which works with z-index as –1 on it.

<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%" style="z-index:-1;">
<param name="source" value="ClientBin/SilverlightApplication4.xap"/>
<param name="onerror" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="2.0.31005.0" />
<param name="autoUpgrade" value="true" />
<param name="Windowless" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>
</a>
</object>

Although there is one caveat here, while creating a Silverlight object using the createObject method, be sure to use the parameter name isWindowless and not Windowless.

Peace!


Sleek JavaScript search box for Live Search

May be I am a little late in talking about this :), but Live Search provides a really elegant solution for embedding search functionality on your site. Here is the link http://www.bing.com/siteowner . Here is a snapshot taken on my Vista.

search

 

It allows you to search sites you mention. You can add your own sites which you have created and Live Search would crawl them. It is just few lines of JavaScript and some markup which can be customized to change the look and feel of the box.

Happy Programming!


Google Wave – The way Email should be.

Google has unveiled yet another cool idea for communication in the cloud. Google wave allows communication across email, blogs, social networks seamlessly. The fact that email being considered as a bulletin board application gives a different face to the traditional email system we have accustomed to until now. Although it is much more than just email and scraps.

And yes, it is Open Source!

Check out the awesome Developer Preview video here http://www.youtube.com/watch?v=v_UyVmITiYQ.

Happy Programming!


Facebook Connect on iPhone

Yup. This is just another attempt to showcase Facebook Connect stuff in an iPhone application. I was working since last few days (taking time from my office) to get some Facebook Connect stuff working on an iPhone. As a summary of what this app does –:

  • Detects your current location using the iPhone Core Location framework.
  • Gets the closest Zip Code using GeoNames webservice. 
  • Allows to search for a place/thing near you, using the Google Local Search API.
  • Allows to publish a story onto your Facebook home page.

Thats all my app does. Here are some snap shots. The app is very much functional but might not look awesome like those sexy apps on www.apple.com. Sigh!, I can never be a designer.

 

Picture 2 Picture 1  Picture 10 Picture 4

Picture 8 Picture 5 Picture 6 Picture 7

So here is a quick summary of the tools I used to put this functionalities in an iPhone.

iPhone Core Location Framework – This is an inbuilt SDK component which is available for all iPhone developers. Its pretty straight forward to use this framework to get the current longitude and latitude of the place where you are with your iPhone. Here is a link which explains a step by step details for the same http://iappdevs.blog.co.in/2008/12/06/get-current-location-sample-example-iphone-programming/.

GeoNames – Once you have the geo positions, you can use Google Api’s directly to get different kinds of places around you. Although I intend to have a small weather widget and the name of the city/state you are in right now. So I used the GeoNames webservices which provide a list of probably zipcodes for a given longitude and latitude combination. Here is a link for more information about different services provided by GeoNames http://www.geonames.org/export/.

Google API’s – Now since I know your correct location (as per the webservice), I would be using google Local search API to get the nearby results for the search term entered. Google Ajax API for Local Search accepts longitude/latitude combination and a search query which returns the result in a JSON format. Here is the link for the Google API’s for local search http://code.google.com/apis/ajaxsearch/documentation/reference.html#_intro_fonje.

Of course this arises a question about how to parse the JSON result on the iPhone. Chill out! You are not alone in this world. You will find several results for JSON parsing on iPhone when searched on the net, but here is a link which helped me a lot http://iphonedevelopertips.com/cocoa/json-framework-for-iphone-part-2.html.

Facebook Connect – By now, everyone knows that Facebook has shown interests in the iPhone a lot. Facebook connect is awesome and on iPhone is even better. It is a bit flaky in some cases but most of the time, it works as it should. I am sure it ain’t difficult to get a link for this topic :), but what the heck(lazy bums), here is the link http://developers.facebook.com/connect.php?tab=iphone. Do check out the video on Facebook implementation on iPhone and you are good to go.

 

Happy Programming!