Problems in India or India in Problems


Problems in India or India in Problem: bad education, corrupt politicians and entire system, inequality, inflation, rapes, terrorism, overpopulation, brain drain, malnutrition, gender inequality, pollution, slow legal system, only urban development leading to migration of people to urban areas, people like Mallya enjoying life and farmers dying everyday due to huge debts, never ending list…

Attitude


“The longer I live, the more I realize the impact of attitude on life. Attitude, to me, is more important than facts. It is more important than the past, the education, the money, than circumstances, than failure, than successes, than what other people think or say or do. It is more important than appearance, giftedness or skill. It will make or break a company… a church… a home. The remarkable thing is we have a choice everyday regarding the attitude we will embrace for that day. We cannot change our past… we cannot change the fact that people will act in a certain way. We cannot change the inevitable. The only thing we can do is play on the one string we have, and that is our attitude. I am convinced that life is 10% what happens to me and 90% of how I react to it. And so it is with you… we are in charge of our Attitudes.”

Charles R. Swindoll quotes (American Writer and Clergyman, b.1934)

Scrolling Menu using Jquery


Hi Guys..

In this post I want to share a method of how you can implement scrollable Menu on HTML page using
Jquery.
The steps to implement scrollable Menu are as follows: Demo is available here

1. Include the Jquery Library:

<script src="jquery-1.3.2.min.js" type="text/javascript"></script>

2. Now, lets start with the menu which we want to be scrollable:

Let’s assign id as “scrollable-menu” to the menu:(The menu will be as under)

<div id="scrollable-menu">
<ul>
<li>Home</li>
<li>Pictures</li>
<li>Contact Me</li>
</ul>
</div>

3. Next is we start write the script code using jquery to implement the scroll:
Jquery has a function to handle the event scroll.

// This is the scroll event handler
$(window).scroll(function() {
//Write the action on scroll event here.
});

4. Lets get down on the action of moving the menu as we perform the action of scrolling:

$(window).scroll(function(){
$("#scrollable-menu")
.animate({"marginTop": ($(window).scrollTop()) + "px"}, "slow" );
});

Explanation:
$(window).scroll –> this is the function for scroll event for Window.
This event occurs whenever you scroll the window on browser and this
function will get executed.

$(“#scrollable-menu”) –> this is the selector which gets you the instance of DOM object
with id scrollable-menu and as we want to scroll the menu we are using its id

.animate is the function provided by jquery to perform custom animations on
object using CSS properties.

$(window).scrollTop() –> this is the function which provides us the numerical figure
of the amount of scroll performed on window
Ans using this value we are setting the margin-top value of Menu so, that it is
seen in the visible area of the page.
“slow” is the parameter of animate function to enable the animation on screen,
you can also use any numerical value in place of slow(it is in milli seconds)
More about animate function – here
More about scrollTop Function – here

5. Because this event can fire many times in a row we need to make sure we stop all previous repositions before progressing with the latest one. Imagine a users scrolls 3-4 times really fast. We want just the last call to be in control of the repositioning. Ensuring that all repositioning is stopped beforehand makes for much faster handling of the event, resulting in smoother animation. We call this BEFORE the code snippet above.

$(window).scroll(function(){
$("#scrollable-menu")
.stop()
.animate({"marginTop": ($(window).scrollTop()) + "px"}, "slow" );
});

6. One more way we can make the code smoother is storing the instance for the object that needs to be accessed
for every scroll event. Whenever the scroll event fires jQuery traverses the DOM looking for our element. In order to alleviate this overhead we can simply store the jQuery reference to our element in a variable when the DOM is initialised and reference this instead.

var $scrollableMenu = $("#scrollable-menu");

$(window).scroll(function(){
$scrollableMenu
.stop()
.animate({"marginTop": ($(window).scrollTop() + 30) + "px"}, "slow" );
});

7. The final Code will be as follows:

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script>
$().ready(function() {
var $scrollableMenu = $("#scrollable-menu");

$(window).scroll(function(){
$scrollableMenu
.stop()
.animate({"marginTop": ($(window).scrollTop() + 30) + "px"}, "slow" );
});
});
</script>

Thats all.. Jquery makes all simple.. :) :D

Happy Birthday MOM


Its only your love mom
That brought me in this beautiful world
And gave best family in this world
Taught me how beautiful this world is..

Its just your love mom……
You hug me tight when I cry
You lift me up when I fall
You shaped my life like beautiful pot

Its just your love mom
You forgive all my silly mistakes
You fight for me against everything that come in my way
Your smile keeps me happy and alive

Its just your love mom
Now as I am far away from you
Its hard to show what I feel for you
You are tears in my eyes and smile on my face
I don’t say that I miss you because
You are always there with me like shadow ..so I say…

ITS ONLY YOUR LOVE MOM

Many Many Happy returns of the day to you MOM… :)
Reference: via @Shruti Zamwar

IE vs FF Working with dynamic Tables


Today I am gonna write another thing I came across while working on Javascript.
Sometimes, even if it’s easier to work with list <li> elements in HTML, but the design department may make a
design using tables.
Well what I wanted to do was read some information and dynamically create table and assign correct info to its
rows, columns.
Lets write the basic HTML code for table element:

<table>
<tr>
<td>Row1 Column1</td>
<td>Row1 Column2</td>
</tr>
<tr>
<td>Row2 Column1</td>
<td>Row2 Column2</td>
</tr>
</table>

So, looking at the table and other tags used with table, I made those elements using the Javascript Code.
The Code used to create table is as follows:

var myTable = document.createElement("table");
var myRow = document.createElement("tr");
var myCell = document.createElement("td");
myCell.innerHTML = "Hello World!";
myTable.appendChild(myRow);
myRow .appendChild(myCell);

Now, for this Javascript, Firefox was fine, but it did not worked on IE. So, I searched on Internet and then using
Firebug I noticed one thing that we also have another element inside table as <tbody> and this was the actual problem.
On FF it makes this element and adds it to the table tag. But, IE does not.
So, the new code that worked for both IE and FF is as under:

var myTable = document.createElement("table");
var myTbody = document.createElement("tbody");
var myRow = document.createElement("tr");
var myCell = document.createElement("td");
myCell.innerHTML = "Hello World!";
myTable.appendChild(myTbody);
myTbody.appendChild(myRow);
myRow.appendChild(myCell);

And, as you can see in the code above, I am manually creating the tbody element and appending it to the table.
And, the row element is appended to this tbody element.
Finally, the problem with creating tables dynamically was solved. :)
May this help you when u face similar problem.
Cheers.. :)

JSONP… and why JSONP


How to start.. ?

I am working on Ajax and I need to get some data, that is using XML.

If I am working on domain, lets say  mysite.com and I need to get some data using xml

from the same domain,  where the xml url is mysite.com/myxml.xml , So here you can direct

get the xml from this specific domain using HttpRequest.

But, what if you want data from some other domain, may be  othersite.com/.

So, here XML will not be of an use, as XML httpRequest works only for the same domain

i.e. the requester and the responder are the same domains.

So, you may say lets use JSON. But, here JSON is also of no use.

As, JSON is just a formatting of data for (similar to XML)XML.

But it is also of no use for Cross Domain data Access.

What is JSON:  JSON is Java Script Object Notaion. It is a lightweight data-interchange format.

The JSON filename extension is .json.

JSON is an alternative to XML and it is more easy to access than XML.

So if XML is as follows:

<?xml version="1.0" encoding="UTF-8"?>
<contacts>
    <contact id="1">
        <name>Anu Zamwar</name>
        <phone>123-456-7890</phone>
        <address>
            <street>123 JFKStreet</street>
            <city>Any Town</city>
            <state>Any State</state>
            <zipCode>12345</zipCode>
        </address>
    </contact>
</contacts>

So, JSON for this XML will be as:

{
   "contacts" : {
      "contact" : {
         "@attributes" : {
            "id" : "1"
         },
         "name" : "Anu Zamwar",
         "phone" : "123-456-7890",
         "address" : {
            "street" : "123 JFK Street",
            "city" : "Any Town",
            "state" : "Any State",
            "zipCode" : "12345"
         }
      }
   }
}

So, now let me get back to the point, how to overcome the problem of Cross Domain Data Access.

JSONP is a means by which to get JSON data from another

domain than the one your page is on.

If you try and use Ajax to request data from a different

domain than the page, you’ll get a security error.

One way around this is a concept some call “JSONP”.

This is where you include a script tag in your document. This script

tag points to an external javascript source and when the

script tag loads it executes (like any other script tag).

The catch is that you need to be able to tell that server what

to wrap the data with so your functions can handle it.

Let’s say we are on this page at clientcide.com.

Let’s say we want to get some data from the flicker api at flicker.com/services/api.

Here’s a simple request that gets the latest photos:

http://www.flickr.com/services/feeds/photos_public.gne?format=json

To Overcome this problem of Cross Domain Data Access, JSONP comes into picture. What is JSONP?

I asked this to Google and he gave me few answers as always. You can also get some from googly..

So, whats the difference between JSON and JSONP. Both are same, except the difference that in JSONP,

you also include a call back function name. So, when u need to get the data of this JSONP using AJAX,

you need to tell AJAx the name of the call back Function defined in JSONP file.

How will the above JSON look when written as JSONP:

func({
   "contacts" : {
      "contact" : {
           "@attributes" : {
                 "id" : "1"
            },
         "name" : "Anu Zamwar",
         "phone" : "123-456-7890",
         "address" : {
            "street" : "123 JFK Street",
            "city" : "Any Town",
            "state" : "Any State",
            "zipCode" : "12345"
         }
      }
   }
});

⇒ func is the Callback function, used in the above JSONP file.
Now let this above JSONP file name be myjsonp.json

and it is under domain → http://www.othersdomain.com/myjsonp.json

And you domain is http://www.mydomain.com/

I am using Jquery.ajax to show the working with JSONP. Code is as follows:

$.ajax({
url: "http://www.othersdomain.com/myjsonp.json", //URL of JSONP File
dataType: "jsonp",  // Data type is JSONP
processData: false, // No need to process Data, we use it as JSONP
jsonpCallback: "func",  // Callback function
success: function(data,textStatus,obj) {
var name = data.contacts.contact.name;
alert("Name is: " + name);

} });

So, here it is the use of JSONP to over come the problem of Cross Domain Requests..

:)