Another year is going to be lost for ever from our life. As well, I am also exited about the upcoming unknown facts about my life. Now, what I got in 2009?
* I graduated for around 1.5 years before from now on. So, 2009 is the year, where I passed the full year in employment(in 2008, part of that year, i was student, and partly employed).
* 2009 was a great year for me for learning development. I learned a lot of things this year. May be I didn't meet what i should have learned actually, but though, at least, learn something that will help me in future.
* It was a great year for me on freelance career. I am working on freelacer.com site as part time freelancer. I started this freelance career on 2008,around end of the year. But due to lacking of enough knowledge on development knowledge and also due to no feedback/very few feedback, didn't got that much projects on 2008. But, comparatively, got a lot of projects/works in 2009. So, this is obviously a great year.
* Changed my residence three times in 2009 :(
* Another year passed by, couldn't get married yet :(
I wish to have something better on the next year. A proverb is known like "passed days were good, upcoming days are worse". I wish to get this reversed, "get better time than past days":
* Want to get married this year, don't want to be single anymore :)
* Wanna buy a good laptop. I am feeling a great need of this thing. Waiting for a good one with windows 7.
* Want to make a rapid growth on my freelance career. More than past year. I wish to make this improvement significant, lets see what happens.
* Want to get more advanced with what I know and wish to learn many many new things that will help me growing well.
At last, Wish you all a very very Happy New Year 2010!!!!!!!
1
To connect to mysql database from java, you have to first have the mysql-jdbc connector jar file from hre,mysql jdbc connector.
Download the file, get the jar and import that to your current project.
Prepare your mysql db, create a new database named 'testdb', make a table 'mytable', make some column, insert some data. Or if you want to work with some existing database,tables etc, that will also be fine.
After mysql preparation completed and database server is running, open a java file for testing, write the following lines:
now we have completed connecting. Also don't forget to close the connection at the end of your code.
Here is some example code for manipulating your db from java:
You can also use this for connecting to other databases, just use different connection library for each.
Download the file, get the jar and import that to your current project.
Prepare your mysql db, create a new database named 'testdb', make a table 'mytable', make some column, insert some data. Or if you want to work with some existing database,tables etc, that will also be fine.
After mysql preparation completed and database server is running, open a java file for testing, write the following lines:
Connection conn = null;
try{
String userName = "username";
String password = "passsword";
String url = "jdbc:mysql:portnumber//localhost/databasename";
//here we are using the library
Class.forName ("com.mysql.jdbc.Driver").newInstance ();
conn = DriverManager.getConnection (url, userName, password);
System.out.println ("Database connection established");
}
catch (Exception e){
System.err.println ("Couldn't connect to mysql database");
}
now we have completed connecting. Also don't forget to close the connection at the end of your code.
Here is some example code for manipulating your db from java:
if (conn != null){
try{
String id="id";
String val="value";
PreparedStatement ps;
ps = conn.prepareStatement("INSERT INTO animal (name, category) VALUES(?,?)");
ps.setString (1, id);
ps.setString (2, val);
int count = ps.executeUpdate ();
}
catch (Exception e){
//if you need to do something upon error
}
finally{
conn.close ();
System.out.println ("Database connection closed");
}
}
You can also use this for connecting to other databases, just use different connection library for each.
JAVA:
As we know call by value and call by reference is an important features of c/c++. JAVA eliminate the call by reference features because if security reasons. But still, if we work with JAVA objects, we can use something similar to call by references. Try the following java code snippet:
public static void main(String[] args) {
// TODO code application logic here
A a = new A();
a.a = 1;
changeValue(a);
System.out.println(a.a);
}
public static void changeValue(A obj){
obj.a = 10;
}
public static class A{
public int a;
}
this will print 10. Here it seems like doing call by reference, but actually not. obj object is initiating a new object space where its placing a objects location. By this way, we just having a ways to access and change the properties of a object.
Try with the following example for more understanding:
public static void main(String[] args) {
// TODO code application logic here
A a = new A();
a.a = 1;
changeValue(a);
System.out.println(a.a);
}
public static void changeValue(A obj){
obj = new A();
obj.a = 15;
}
public static class A{
public int a;
}
Now, you will see, output is 1 rather than 15. Because, whenever obj is making a new object its loosing a's location and allocating another space, so now, obj has no effect on a' object.
C#:
Same like JAVA, C# will also doing the same. In addition, its also reserving the reference features. This is accomplished by a 'ref' keyword before the both parameter and argument. Try the following code:
public class A
{
public int x = 10;
}
static void Main(string[] args)
{
A obj = new A();
Change(ref obj);
Console.WriteLine(obj.x.ToString());
Console.ReadLine();
}
public static void Change(ref A obj)
{
obj = new A();
obj.x = 1;
}
Now, its going to print 1 as obj is referring to a's location and creating a new object at the same location.
Hope you have understood this call by value and call by reference features in these two major programming language.
As we know call by value and call by reference is an important features of c/c++. JAVA eliminate the call by reference features because if security reasons. But still, if we work with JAVA objects, we can use something similar to call by references. Try the following java code snippet:
public static void main(String[] args) {
// TODO code application logic here
A a = new A();
a.a = 1;
changeValue(a);
System.out.println(a.a);
}
public static void changeValue(A obj){
obj.a = 10;
}
public static class A{
public int a;
}
this will print 10. Here it seems like doing call by reference, but actually not. obj object is initiating a new object space where its placing a objects location. By this way, we just having a ways to access and change the properties of a object.
Try with the following example for more understanding:
public static void main(String[] args) {
// TODO code application logic here
A a = new A();
a.a = 1;
changeValue(a);
System.out.println(a.a);
}
public static void changeValue(A obj){
obj = new A();
obj.a = 15;
}
public static class A{
public int a;
}
Now, you will see, output is 1 rather than 15. Because, whenever obj is making a new object its loosing a's location and allocating another space, so now, obj has no effect on a' object.
C#:
Same like JAVA, C# will also doing the same. In addition, its also reserving the reference features. This is accomplished by a 'ref' keyword before the both parameter and argument. Try the following code:
public class A
{
public int x = 10;
}
static void Main(string[] args)
{
A obj = new A();
Change(ref obj);
Console.WriteLine(obj.x.ToString());
Console.ReadLine();
}
public static void Change(ref A obj)
{
obj = new A();
obj.x = 1;
}
Now, its going to print 1 as obj is referring to a's location and creating a new object at the same location.
Hope you have understood this call by value and call by reference features in these two major programming language.
Here I am going to give a few words on using and manipulating Jquery DOM object. Actually, this is agreed by most of the developers that, regular expression for referencing selector of Jquery framework is the most powerful feature.To point/refer to an DOM object is pretty much easier using jquery than standard javascript.
To get the DOM object you can use either $ or JQuery. suppose the document object can be referenced by using "$(document)" or by JQuery(document). to execute an function on document load, you can use the following code
$(document).ready(FUNCTIONNAME);
or
$(document).ready(function(){
//codegoes here
});
This is actually a replacement of standard javascript code like:
window.onload = function(){
//code goes here
}
not much useful, right? You will know the real importance very soon.
Lets assume, we are going to get all div element with classname 'test' and set their border color to red. in standard javascript, you have to do something similar as follows:
var elements = document.getElementsByClassName('test');
for(var i=0;i<elements.length;i++)
{
elements[i].style.border = "#FF0000";
}
but, in jquery, you can do it by a single code snippet as follows:
$(".test").css('border','#FF0000');
interesting right?
Also, another efficiency that, to select an dom object, you can use exactly like css selector expression. Like, to get element of specific id name you can use $("#idname"), to get element of specific classname, you can use $(".classname"), to select all child div of a parent div you can use, $("div#id div") etc.
you can apply attribute/css using $("object expression").attr('propertyname','value')
and $("object expression").css('propertyname','value');
Another interesting thing is, to get a value, just use first parameter, to set, add second parameter to the function, its that easy.
Another important thing is that, javascript objects work by reference, always point to same object. On the other hand, in jquery, copy of object is created. so, if you have done var obj = $('#idname') and next time obj not working, use $(obj), to reference it again.
Another thing, before using expression you must be sure that, object for that exist, otherwise you shouldn't apply any property value to it. to become sure about it, use
if($("expression").length>0){
//set style/property
}
if there is no object and you are trying to set something, javascript will stop executing and no other code after this will be executed.
To ready more about jquery, read their online documentation
To get the DOM object you can use either $ or JQuery. suppose the document object can be referenced by using "$(document)" or by JQuery(document). to execute an function on document load, you can use the following code
$(document).ready(FUNCTIONNAME);
or
$(document).ready(function(){
//codegoes here
});
This is actually a replacement of standard javascript code like:
window.onload = function(){
//code goes here
}
not much useful, right? You will know the real importance very soon.
Lets assume, we are going to get all div element with classname 'test' and set their border color to red. in standard javascript, you have to do something similar as follows:
var elements = document.getElementsByClassName('test');
for(var i=0;i<elements.length;i++)
{
elements[i].style.border = "#FF0000";
}
but, in jquery, you can do it by a single code snippet as follows:
$(".test").css('border','#FF0000');
interesting right?
Also, another efficiency that, to select an dom object, you can use exactly like css selector expression. Like, to get element of specific id name you can use $("#idname"), to get element of specific classname, you can use $(".classname"), to select all child div of a parent div you can use, $("div#id div") etc.
you can apply attribute/css using $("object expression").attr('propertyname','value')
and $("object expression").css('propertyname','value');
Another interesting thing is, to get a value, just use first parameter, to set, add second parameter to the function, its that easy.
Another important thing is that, javascript objects work by reference, always point to same object. On the other hand, in jquery, copy of object is created. so, if you have done var obj = $('#idname') and next time obj not working, use $(obj), to reference it again.
Another thing, before using expression you must be sure that, object for that exist, otherwise you shouldn't apply any property value to it. to become sure about it, use
if($("expression").length>0){
//set style/property
}
if there is no object and you are trying to set something, javascript will stop executing and no other code after this will be executed.
To ready more about jquery, read their online documentation
XML are being used more and more day by day. Their main featres are portability and recognized by most of the programming languages. JavaScript is not away from it. JavaScript also can parse/manipulate XML files. Jquery, the ultimate JavaScript library just made it more simple and easy to use. By this, you can traverse a XHTML(its XHTML, not HTML, your file must be w3valid) file and/or a XML file very similarly. I will be used common example for both.
First, you have to call to your file to be loaded, either an HTML or an XML file. You can do call with three options with Jquery, $.get, $.post or $.ajax. Generally get or post options are used for sending data to server, although that doesn't mean, we can't use them, but we will use $.ajax simply. The code will be like as follows:
$.ajax({type: "GET",url: "simpleXMLData.xml",success:GetResponse});
here you can see,first parameter: we can use the type get or post, of our own choice. Second parameter: you can use HTML file, even php/aspx file(any url also unless you have security restrictions) that results a XHTML code, you can load them also. Actually, you can call to any file type, just for now, we are concerned about xml/xhtml file and parse/traverse them using jquery. Third parameter, we name a function that will be executed after browser get the response from requested file/url
. If you simply alert the response data in that function you will see the full response code:
function GetResponse(data){
alert(data);
}
now, first we have to convert our response to a DOM object to be able to traverse by jquery. that's not big deal, $(data) will simply be the expected object we want. now suppose we have a XML file like as follows:
<?xml version="1.0" encoding="iso-8859-1"?>
<xmlobject>
<item>
test xml data
</item>
<item>
test xml data 2
</item>
//.......... so on
</xmlobject>
now you can traverse to each with this following simple code:
$(data).find('item').each(function(){
alert($(this).text());
})
remember, if you try to use $(this).html(), this won't work(specially on server, on local HTML and script file, it will work fine), you have catch them as child. If you are looking for getting the index of current item, use this code
$(this).parent().index($(this));
if you are looking for get a specific indexed child, without going all loop and check, try this:
$(data).find('item').eq(index)
you will get the specific item Dom object you want.
You can also go one item ahead, or back using $(current).next() and $(current).prev()
If you understand these clearly, you can have a look for Jquery XML Travers documentation of jquery. There you can checkout all functions,properties that Jquery supports and will understand very quickly as you have the basic understanding now.
First, you have to call to your file to be loaded, either an HTML or an XML file. You can do call with three options with Jquery, $.get, $.post or $.ajax. Generally get or post options are used for sending data to server, although that doesn't mean, we can't use them, but we will use $.ajax simply. The code will be like as follows:
$.ajax({type: "GET",url: "simpleXMLData.xml",success:GetResponse});
here you can see,first parameter: we can use the type get or post, of our own choice. Second parameter: you can use HTML file, even php/aspx file(any url also unless you have security restrictions) that results a XHTML code, you can load them also. Actually, you can call to any file type, just for now, we are concerned about xml/xhtml file and parse/traverse them using jquery. Third parameter, we name a function that will be executed after browser get the response from requested file/url
. If you simply alert the response data in that function you will see the full response code:
function GetResponse(data){
alert(data);
}
now, first we have to convert our response to a DOM object to be able to traverse by jquery. that's not big deal, $(data) will simply be the expected object we want. now suppose we have a XML file like as follows:
<?xml version="1.0" encoding="iso-8859-1"?>
<xmlobject>
<item>
test xml data
</item>
<item>
test xml data 2
</item>
//.......... so on
</xmlobject>
now you can traverse to each with this following simple code:
$(data).find('item').each(function(){
alert($(this).text());
})
remember, if you try to use $(this).html(), this won't work(specially on server, on local HTML and script file, it will work fine), you have catch them as child. If you are looking for getting the index of current item, use this code
$(this).parent().index($(this));
if you are looking for get a specific indexed child, without going all loop and check, try this:
$(data).find('item').eq(index)
you will get the specific item Dom object you want.
You can also go one item ahead, or back using $(current).next() and $(current).prev()
If you understand these clearly, you can have a look for Jquery XML Travers documentation of jquery. There you can checkout all functions,properties that Jquery supports and will understand very quickly as you have the basic understanding now.
Here, by local time, I mean the timezone where the visitor lives in. To track a visitor timezone is an issue because php works with the time where the server resides, or you can say, server computer time,not where the visitor stay. But still, we have few ways to get this done:
* You can use an IP to country/timezone converter code. For this, you have to have a database for all ip and corresponding timezone info.And then code php to get corresponding timezone retrieved. There are some free database out there. search about them. But, problem with this procedure is that:
- You have to update database periodically.
- Database might not include timezone info for all ip.
You can also solve this problem by using free web service like hostip.info, but may not fulfill your requirements, such as may not include timezone info at response(hostip doesn't have).
* You can somehow send the the time of the visitor pc to server php script. Yes, you can do this also. Also here, you have multiple option.
- If you are interested in sending the local time on some postback, simply send a post(hidden variable) or get variable(url string variable) to php with set the local time using javascript like as follows:
document.getElementById('hiddenvariableid').value = new Date().getTime(), or just a format you want.
- If you don't want it on post back, need it when page loads, then you can use cookie. that means, first set a cookie variable with time, reload page, read cookie from php, clear the cookie after page execution complete. This will require a code snippet as like follows:
<!-- keep this script part at the top of your php page -->
<script language="javascript">
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
createCookie('localTime',new Date().getHours(),7);
</script>
<?php
$h = date('G'); //set variable $h to the hour of the day
$clientTime = $_COOKIE["localTime"];
if(empty($_COOKIE["reload"])){
echo "<script language='javascript'>createCookie('reload','reloaded',7);window.location.reload();</script>";
}
if(!empty($clientTime)){
$h = $clientTime;
}
// HERE all your codes goes
?>
<!-- keep this script part at the bottom pf your page -->
<script language='javascript'>
createCookie('reload','',-1);
</script>
This is the most light weight use to solve it. But it also have problems:
- It sending visitor pc data, so if visitor computer has wrong time set, then it will work with that info.
Ok, this is how to retrieve visitor's local time using php and/or with help of javascript. I have tried to help you with all cases that might results, pros and cons also. Choose one that suites your application requirements correctly.
* You can use an IP to country/timezone converter code. For this, you have to have a database for all ip and corresponding timezone info.And then code php to get corresponding timezone retrieved. There are some free database out there. search about them. But, problem with this procedure is that:
- You have to update database periodically.
- Database might not include timezone info for all ip.
You can also solve this problem by using free web service like hostip.info, but may not fulfill your requirements, such as may not include timezone info at response(hostip doesn't have).
* You can somehow send the the time of the visitor pc to server php script. Yes, you can do this also. Also here, you have multiple option.
- If you are interested in sending the local time on some postback, simply send a post(hidden variable) or get variable(url string variable) to php with set the local time using javascript like as follows:
document.getElementById('hiddenvariableid').value = new Date().getTime(), or just a format you want.
- If you don't want it on post back, need it when page loads, then you can use cookie. that means, first set a cookie variable with time, reload page, read cookie from php, clear the cookie after page execution complete. This will require a code snippet as like follows:
<!-- keep this script part at the top of your php page -->
<script language="javascript">
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
createCookie('localTime',new Date().getHours(),7);
</script>
<?php
$h = date('G'); //set variable $h to the hour of the day
$clientTime = $_COOKIE["localTime"];
if(empty($_COOKIE["reload"])){
echo "<script language='javascript'>createCookie('reload','reloaded',7);window.location.reload();</script>";
}
if(!empty($clientTime)){
$h = $clientTime;
}
// HERE all your codes goes
?>
<!-- keep this script part at the bottom pf your page -->
<script language='javascript'>
createCookie('reload','',-1);
</script>
This is the most light weight use to solve it. But it also have problems:
- It sending visitor pc data, so if visitor computer has wrong time set, then it will work with that info.
Ok, this is how to retrieve visitor's local time using php and/or with help of javascript. I have tried to help you with all cases that might results, pros and cons also. Choose one that suites your application requirements correctly.
Are you having problems with submitting your blogger blog site map to search engine's webmaster tools? You have submitted the correct site map, but your webmaster tools saying that only 26 urls are submitted? I was also having the same problem around for several days. But, at last I found the solution. Let me explain this a little to you.
blogger have various type of sitemaps, like
http://yourblogname.blogspot.com/rss.xml
http://yourblogname.blogspot.com/atom.xml
http://yourblogname.blogspot.com/feeds/posts/default?orderby=updated
The last one is from your robots.txt (path:http://yourblogname.blogspot.com/robots.txt). And if you don't use webmaster tools to submit the sitemap, all search engines will discover your site map through this robots.txt and will get the last one. So, if you are not using the webmaster tools, simply have a look to your sitemap(paste the url to browser changing your blogname and enter), check how many posts are there on the feed?
Surprised?? Yes, there are only 26 post showing over there. Even if you were submitting this to webmaster tools, same will be happen, only 26 urls will be submitted(where you may have several hundreds posts). Try checking other feeds, same will happen. So, what to do now?
Relax! We have solution. we will submit our site map to webmaster tools, but with some more parameters. Whats are this? Lets see.
If you go to the site map section in Google webmaster tools, you will see that you are allowed to submit the rest part after your site url
http://yourblogname.blogspot.com/
this part already exists, you have to submit the rest part. Lets decide to submit atom.xml. First add one parameter like as follows
atom.xml?redirect=false
this will tell the server to stay on the atom.xml not redirect to another(as it will if your using other feeds like feedburner). Now use another two parameters:
atom.xml?redirect=false&start-index=1&max-results=100
This is telling that posts url will be start from index one, your latest post and it will results maximum 100 posts. So, just checkout the following url on browser:
http://yourblogname.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=100
Wow!! Yes, now it showing all the posts you have written. Having more than 100 posts, nothing to worry, simply change the last number 100 to the number of posts you have. Submit this and checkout in few days. You will get how many urls are indexed. do some more works on which aren't indexed and submit again.
You can also submit this same site map to all search engines like
google,
yahoo, bing, alexa, ask etc confidently.Have fun!!!
blogger have various type of sitemaps, like
http://yourblogname.blogspot.com/rss.xml
http://yourblogname.blogspot.com/atom.xml
http://yourblogname.blogspot.com/feeds/posts/default?orderby=updated
The last one is from your robots.txt (path:http://yourblogname.blogspot.com/robots.txt). And if you don't use webmaster tools to submit the sitemap, all search engines will discover your site map through this robots.txt and will get the last one. So, if you are not using the webmaster tools, simply have a look to your sitemap(paste the url to browser changing your blogname and enter), check how many posts are there on the feed?
Surprised?? Yes, there are only 26 post showing over there. Even if you were submitting this to webmaster tools, same will be happen, only 26 urls will be submitted(where you may have several hundreds posts). Try checking other feeds, same will happen. So, what to do now?
Relax! We have solution. we will submit our site map to webmaster tools, but with some more parameters. Whats are this? Lets see.
If you go to the site map section in Google webmaster tools, you will see that you are allowed to submit the rest part after your site url
http://yourblogname.blogspot.com/
this part already exists, you have to submit the rest part. Lets decide to submit atom.xml. First add one parameter like as follows
atom.xml?redirect=false
this will tell the server to stay on the atom.xml not redirect to another(as it will if your using other feeds like feedburner). Now use another two parameters:
atom.xml?redirect=false&start-index=1&max-results=100
This is telling that posts url will be start from index one, your latest post and it will results maximum 100 posts. So, just checkout the following url on browser:
http://yourblogname.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=100
Wow!! Yes, now it showing all the posts you have written. Having more than 100 posts, nothing to worry, simply change the last number 100 to the number of posts you have. Submit this and checkout in few days. You will get how many urls are indexed. do some more works on which aren't indexed and submit again.
You can also submit this same site map to all search engines like
google,
yahoo, bing, alexa, ask etc confidently.Have fun!!!
I am on freelance career for around 1.5 years. From the very beginning, I started to like freelancer.com site. By this time, many things are changed(new attractive layout design, features addition etc). Here I will try to mention some features that make freelancer.com, a uniquely featured site for people finding freelance/outsourcing jobs online:
* COST : Most important feature is its costs. There are many types of cost that freelance service providers faces working online such as project fees taken when won a job, a percentage of earning/bid amount, withdrawal fee to a payment processor or bank account, percentage on bonus payments etc. freelancer.com is best about this according to my experience. they only cut 10% project fee on bid amount for standard member(3% for golden members). No percentage on bonus payment. Lowest rate as withdrawal fee($1 for paypal,moneybookers;No fee for debit MasterCard).
* Lots Of Projects : Its not exactly like unique features, its actually an advantage for freelancers. As this site is very popular and second highest score among freelancing/outsourcing sites at alexa, many projects are posted daily here. SO, its easy to get a job quicker also.
* Membership variation : This site offers you to use two different kinds of membership, standard and golden.standard membership is for those, who works less frequent, golden membership is for professional freelancer want a long term commitment with the site. And obviously golden members get some more facilities than standard members(lower project fees, more expertise, portfolio projects-newly added).
* Extra knowledge on projects bid : You can inquiry for more info either privately(through private message box), or publicly(project clarification message board). You can also become sure whether the project owner has the ability(amount on his account) to pay you for the full project(newly added features). Also, as like other sites, you can check the buyers reputation checking his previous feedback as service buyer.
* Dispute System : You can cancel a project after win if you can't synchronize with buyer's specifications for any kind of reason. Also, a project owner can't give you feedback until you get the full amount bid for the project. Moreover, for more complicated problems, they have dispute system, where you can submit an complain , submit proof & get justice.
* Verified Ratings : You will be rated by project owners only after you are being paid by them. So, no worry to get 'bad rating and no money'. If you can't agree with project owner, try to cancel the project, even if they don't agree to do so, they won't be able to do anything but an incomplete report, that actually have no effect on your overall average rating.
There may be a lot more advantages compared to other sites, but as I am not very old there and didn't experienced that much on other sites yet, may be i am not seeing those points. But, I will try to share my experience with this site much more times in future.
* COST : Most important feature is its costs. There are many types of cost that freelance service providers faces working online such as project fees taken when won a job, a percentage of earning/bid amount, withdrawal fee to a payment processor or bank account, percentage on bonus payments etc. freelancer.com is best about this according to my experience. they only cut 10% project fee on bid amount for standard member(3% for golden members). No percentage on bonus payment. Lowest rate as withdrawal fee($1 for paypal,moneybookers;No fee for debit MasterCard).
* Lots Of Projects : Its not exactly like unique features, its actually an advantage for freelancers. As this site is very popular and second highest score among freelancing/outsourcing sites at alexa, many projects are posted daily here. SO, its easy to get a job quicker also.
* Membership variation : This site offers you to use two different kinds of membership, standard and golden.standard membership is for those, who works less frequent, golden membership is for professional freelancer want a long term commitment with the site. And obviously golden members get some more facilities than standard members(lower project fees, more expertise, portfolio projects-newly added).
* Extra knowledge on projects bid : You can inquiry for more info either privately(through private message box), or publicly(project clarification message board). You can also become sure whether the project owner has the ability(amount on his account) to pay you for the full project(newly added features). Also, as like other sites, you can check the buyers reputation checking his previous feedback as service buyer.
* Dispute System : You can cancel a project after win if you can't synchronize with buyer's specifications for any kind of reason. Also, a project owner can't give you feedback until you get the full amount bid for the project. Moreover, for more complicated problems, they have dispute system, where you can submit an complain , submit proof & get justice.
* Verified Ratings : You will be rated by project owners only after you are being paid by them. So, no worry to get 'bad rating and no money'. If you can't agree with project owner, try to cancel the project, even if they don't agree to do so, they won't be able to do anything but an incomplete report, that actually have no effect on your overall average rating.
There may be a lot more advantages compared to other sites, but as I am not very old there and didn't experienced that much on other sites yet, may be i am not seeing those points. But, I will try to share my experience with this site much more times in future.
Before, many peoples used to disable the javascript option on their browser. But time to time, javascript became as one of most essential part on the web pages rich effect and functionality. This development is still going on and new ideas,thing are being added day by day. One of the new idea i got to implement is scrollable menu of a site(of course very few numbers of menu like 3 or 4). Although there are scrolling system using jquery like image thumbnail gallery,carousel, this one is much richer than those.It can be used as your sites main navigation menu, horizontal or vertical, doesn't matter. I found a solution here, is named as jquery scrollable navigation system; they have also an acceptance as jquery plug-in which are description on jquery plug-in page. But, at the beginning, i got with their documentation as they describe documentation with there own made design & functionality together(here) where i needed to implement only the functionality as i had the existing designed site already. So I decided to share the very basic idea to implement this scrollable functionality.
* First download the plug-in from here. You can customize what you need to download & what not. You either download a specific plug-in up to all together.
* import both jquery & this tool to your site.
* here we will go with two parts. first, the navigation part, that will navigate to each menu items part/page.
1. if you already have an navigation menu, then simply add a class name 'navigation' to all your navigation link/ container that includes all navigation links. examples are:
<div class="navi">navigation 1</div>
<div class="navi">navigation 2</div>
Or
<li class="navi"><a class="active" title="title 1">1st menu</a></li>
<li class="navi" ><a title="title 2">2nd menu</a></li>
<li class="navi"><a title="title 3">3rd menu</a></li>
or
<li class="navi">
<a class="active" title="title 1">
<a title="title 2">2nd menu</a>
<a title="title 3">3rd menu</a>
</li>
2. your body part- use the following div structure:
<div class="scrollable">
<div class="items">
<div class="item"> content for 1st menu </div>
<div class="item"> content for 2nd menu </div>
<div class="item"> content for 3rd menu </div>
</div>
</div>
Remember, all content will be made in a single template file and will be made scrollable with the script. But if you already have individual pages and make them scrollable you have, you can use iframe. use individual iframe for each content. they will be loaded individually along with this scrollable effect without any kind of problem.
* CSS Part- The most important CSS is the following:
.scrollable .items {
width:20000em;
}
the width must be sufficient to hold 2-3 scrollable content, so that they scroll smoothly. otherwise effect won't work. You can also use other css also, but isn't required actually.
* make this into action- use the following script at the head section on dosument load
$(document).ready(function(){
$(".scrollable").scrollable({size: 1}).navigator(".navi");
});
You should be done successfully by now. run & test your program.When you click on navigation menu item, your page will be scrolled to your destination smoothly experiencing an slide show like effect. The only and not less significance disadvantage is that, all the items of the menu will be loaded on page load, so it may take longer time if you try to use several pages. It will be good to use 2-3 at once. Also, you can extend it to be an ajax based system so that other loadings are being handled in background, that will be much appreciable.
* First download the plug-in from here. You can customize what you need to download & what not. You either download a specific plug-in up to all together.
* import both jquery & this tool to your site.
* here we will go with two parts. first, the navigation part, that will navigate to each menu items part/page.
1. if you already have an navigation menu, then simply add a class name 'navigation' to all your navigation link/ container that includes all navigation links. examples are:
<div class="navi">navigation 1</div>
<div class="navi">navigation 2</div>
Or
<li class="navi"><a class="active" title="title 1">1st menu</a></li>
<li class="navi" ><a title="title 2">2nd menu</a></li>
<li class="navi"><a title="title 3">3rd menu</a></li>
or
<li class="navi">
<a class="active" title="title 1">
<a title="title 2">2nd menu</a>
<a title="title 3">3rd menu</a>
</li>
2. your body part- use the following div structure:
<div class="scrollable">
<div class="items">
<div class="item"> content for 1st menu </div>
<div class="item"> content for 2nd menu </div>
<div class="item"> content for 3rd menu </div>
</div>
</div>
Remember, all content will be made in a single template file and will be made scrollable with the script. But if you already have individual pages and make them scrollable you have, you can use iframe. use individual iframe for each content. they will be loaded individually along with this scrollable effect without any kind of problem.
* CSS Part- The most important CSS is the following:
.scrollable .items {
width:20000em;
}
the width must be sufficient to hold 2-3 scrollable content, so that they scroll smoothly. otherwise effect won't work. You can also use other css also, but isn't required actually.
* make this into action- use the following script at the head section on dosument load
$(document).ready(function(){
$(".scrollable").scrollable({size: 1}).navigator(".navi");
});
You should be done successfully by now. run & test your program.When you click on navigation menu item, your page will be scrolled to your destination smoothly experiencing an slide show like effect. The only and not less significance disadvantage is that, all the items of the menu will be loaded on page load, so it may take longer time if you try to use several pages. It will be good to use 2-3 at once. Also, you can extend it to be an ajax based system so that other loadings are being handled in background, that will be much appreciable.
I just came to know about it yesterday & i thinks its an interesting one. You can easily add a chat widget on your site/blog using one line simple html code. This is provided by meebome, just like a live chat software used by the big corporate website, where these are used to provide customers a live helpdesk. After I singed up, I got a simple one line html code, that is like as follows:
<embed src="http://widget.meebo.com/mm.swf?CMdtizpFre" type="application/x-shockwave-flash" width="190" height="275"></embed>
The best thing is that, in many blogs, there are limited permission and scripting code isn't allowed, this also works there as its not script, just adding/embedding a shock wave flash. So, you can use it wherever you have permission to add a html code.
The main advantages are:
* Live chat with your website visitors if they are having any inquiry to you without having to submit any contact for, just instant.They can leave you a message even if you are not online.
* Besides being online to visitors, you can also be online to your other msngr like yahoo,gtalk,msn,facebook,myspace,aol etc.
* You can get a live notification of visitors when they are visiting your site by downloading meebo desktop notifier. So, each time a visitor come to your site, you will be notified.
Alternatively, there is another popular site, named olark, that also provide this facilities. But, it has some disadvantages such as:
* It uses javascript, so without access to scripting like free account at wordpress.com, you won't be able to add this.
* olark has both free subscription and paid subscription, free one is with very basic features, comparatively meebome one is better as its free and have enough features.
* olark dosn't support as much chat agent as meebome.
I am not talking against it against olark, of course its good for big website for providing live chat support. But this one is mostly useful for simpler small blog/site for chat embed system.
To get this, first, you have to register a meebo account. Now go to meebome site, select options, give your meebo username/passowrd & submit, you will get a simple html code as above, copy & paste that on your sites html code wherever you want that to be visible and you are done.
<embed src="http://widget.meebo.com/mm.swf?CMdtizpFre" type="application/x-shockwave-flash" width="190" height="275"></embed>
The best thing is that, in many blogs, there are limited permission and scripting code isn't allowed, this also works there as its not script, just adding/embedding a shock wave flash. So, you can use it wherever you have permission to add a html code.
The main advantages are:
* Live chat with your website visitors if they are having any inquiry to you without having to submit any contact for, just instant.They can leave you a message even if you are not online.
* Besides being online to visitors, you can also be online to your other msngr like yahoo,gtalk,msn,facebook,myspace,aol etc.
* You can get a live notification of visitors when they are visiting your site by downloading meebo desktop notifier. So, each time a visitor come to your site, you will be notified.
Alternatively, there is another popular site, named olark, that also provide this facilities. But, it has some disadvantages such as:
* It uses javascript, so without access to scripting like free account at wordpress.com, you won't be able to add this.
* olark has both free subscription and paid subscription, free one is with very basic features, comparatively meebome one is better as its free and have enough features.
* olark dosn't support as much chat agent as meebome.
I am not talking against it against olark, of course its good for big website for providing live chat support. But this one is mostly useful for simpler small blog/site for chat embed system.
To get this, first, you have to register a meebo account. Now go to meebome site, select options, give your meebo username/passowrd & submit, you will get a simple html code as above, copy & paste that on your sites html code wherever you want that to be visible and you are done.
Its true that there are several plugins on jquery accordion out there for you. Then why this? This will help you to understand 100% of what you are using on your site, where in case of third party plugin, many bugs/issues aren't actually understandable at all or take alot of time to track those. So its better to use own made code always if its simple to do so.
I actually made this by editing an existing plugin written in protoype. Also I made this very simple so that someone can understand its logic very easily & can modify according to their needs. First of all, all codes are clustered in a javascript class that is actually a function as follows:
function Accordion(container, options)
{
//code goes here.....
}
initializing some variables that will be used later on.
var showAccordion = null;
var currentAccordion = null;
var animating = false;
var option = options;
var da = false;
var thisEvent = option.onEvent;
var accordions = $('#'+container+' .'+option.classNames.toggle);
initializing event handling to make the selected part expanded/shrink effect.
accordions.each(function()
{
$(this).bind(thisEvent, activate);
$(this).next().css('height','0px');
$(this).next().css('display','none');
});
when activated, the following function will be executed
function activate(evnt)
{
if (animating)
{
return false;
}
currentAccordion = $(this).next();
var a = currentAccordion.attr('name');
var b = 'dummy';
if(showAccordion != null)
{
b = showAccordion.attr('name');
}
if (a==b)
{
deactivate(showAccordion);
}
else
{
currentAccordion.css('display','block');
_handleAccordion();
}
}
Here we used call to two different function named deactivate and _handleAccordion. They will be like as follows:
function deactivate(showAccordion)
{
animating = true;
da=true;
showAccordion.animate({height:0},'slow','',AfterShrink);
showAccordion.attr('name','');
}
function _handleAccordion()
{
animating = true;
if (showAccordion)
{
deactivate(showAccordion);
}
currentAccordion.animate({height:option.defaultSize.height},'slow','',AfterExpand);
currentAccordion.attr('name','expanded');
}
the followwing two funcitons will be activated after the above effects completed:
function AfterExpand()
{
showAccordion = currentAccordion;
animating = false;
}
function AfterShrink()
{
showAccordion.css('display','none');
showAccordion = null;
da=false;
animating = false;
}
Remember, Here I used vertical accordion that can be easily changed to horizontal accordion by changing 'height' property to 'width' on animation. Finally, the full code will be like as follows:
function Accordion(container, options)
{
var showAccordion = null;
var currentAccordion = null;
var animating = false;
var option = options;
var da = false;
var thisEvent = option.onEvent;
var accordions = $('#'+container+' .'+option.classNames.toggle);
accordions.each(function()
{
$(this).bind(thisEvent, activate);
$(this).next().css('height','0px');
$(this).next().css('display','none');
});
function activate(evnt)
{
if (animating)
{
return false;
}
currentAccordion = $(this).next();
var a = currentAccordion.attr('name');
var b = 'dummy';
if(showAccordion != null)
{
b = showAccordion.attr('name');
}
if (a==b)
{
deactivate(showAccordion);
}
else
{
currentAccordion.css('display','block');
_handleAccordion();
}
}
function deactivate(showAccordion)
{
animating = true;
da=true;
showAccordion.animate({height:0},'slow','',AfterShrink);
showAccordion.attr('name','');
}
function AfterExpand()
{
showAccordion = currentAccordion;
animating = false;
}
function AfterShrink()
{
showAccordion.css('display','none');
showAccordion = null;
da=false;
animating = false;
}
function _handleAccordion()
{
animating = true;
if (showAccordion)
{
deactivate(showAccordion);
}
currentAccordion.animate({height:option.defaultSize.height},'slow','',AfterExpand);
currentAccordion.attr('name','expanded');
}
}
using this class from your main cller will be as follows:
var option = {
resizeSpeed : 8,
classNames :
{
toggle : 'section_title',
toggleActive : 'accordion_active',
content : 'section_content'
},
defaultSize :
{
width : null,
height : 230
},
direction : 'vertical',
onEvent : 'click'
};
new Accordion('container_id_name',option);
The html structure will need to like follows:
<div id="section_container">
<div class="section"><!--[if !IE]>section div start<![endif]-->
<div class="section_title">1. section 1</div>
<div name="expanded" style="height: 230px; display: block;" class="section_content" id="section1">
<!--content here-->
</div>
</div>
<!-- more sections -->
</div>
This code may have some unused code as i made this very quickly and didn't optimized later. Please do so as a self service :)
If your looking for an independent plugin, not interested to make your own, then use the following links:
Jquery accordion
or
jquery accordion 2
I actually made this by editing an existing plugin written in protoype. Also I made this very simple so that someone can understand its logic very easily & can modify according to their needs. First of all, all codes are clustered in a javascript class that is actually a function as follows:
function Accordion(container, options)
{
//code goes here.....
}
initializing some variables that will be used later on.
var showAccordion = null;
var currentAccordion = null;
var animating = false;
var option = options;
var da = false;
var thisEvent = option.onEvent;
var accordions = $('#'+container+' .'+option.classNames.toggle);
initializing event handling to make the selected part expanded/shrink effect.
accordions.each(function()
{
$(this).bind(thisEvent, activate);
$(this).next().css('height','0px');
$(this).next().css('display','none');
});
when activated, the following function will be executed
function activate(evnt)
{
if (animating)
{
return false;
}
currentAccordion = $(this).next();
var a = currentAccordion.attr('name');
var b = 'dummy';
if(showAccordion != null)
{
b = showAccordion.attr('name');
}
if (a==b)
{
deactivate(showAccordion);
}
else
{
currentAccordion.css('display','block');
_handleAccordion();
}
}
Here we used call to two different function named deactivate and _handleAccordion. They will be like as follows:
function deactivate(showAccordion)
{
animating = true;
da=true;
showAccordion.animate({height:0},'slow','',AfterShrink);
showAccordion.attr('name','');
}
function _handleAccordion()
{
animating = true;
if (showAccordion)
{
deactivate(showAccordion);
}
currentAccordion.animate({height:option.defaultSize.height},'slow','',AfterExpand);
currentAccordion.attr('name','expanded');
}
the followwing two funcitons will be activated after the above effects completed:
function AfterExpand()
{
showAccordion = currentAccordion;
animating = false;
}
function AfterShrink()
{
showAccordion.css('display','none');
showAccordion = null;
da=false;
animating = false;
}
Remember, Here I used vertical accordion that can be easily changed to horizontal accordion by changing 'height' property to 'width' on animation. Finally, the full code will be like as follows:
function Accordion(container, options)
{
var showAccordion = null;
var currentAccordion = null;
var animating = false;
var option = options;
var da = false;
var thisEvent = option.onEvent;
var accordions = $('#'+container+' .'+option.classNames.toggle);
accordions.each(function()
{
$(this).bind(thisEvent, activate);
$(this).next().css('height','0px');
$(this).next().css('display','none');
});
function activate(evnt)
{
if (animating)
{
return false;
}
currentAccordion = $(this).next();
var a = currentAccordion.attr('name');
var b = 'dummy';
if(showAccordion != null)
{
b = showAccordion.attr('name');
}
if (a==b)
{
deactivate(showAccordion);
}
else
{
currentAccordion.css('display','block');
_handleAccordion();
}
}
function deactivate(showAccordion)
{
animating = true;
da=true;
showAccordion.animate({height:0},'slow','',AfterShrink);
showAccordion.attr('name','');
}
function AfterExpand()
{
showAccordion = currentAccordion;
animating = false;
}
function AfterShrink()
{
showAccordion.css('display','none');
showAccordion = null;
da=false;
animating = false;
}
function _handleAccordion()
{
animating = true;
if (showAccordion)
{
deactivate(showAccordion);
}
currentAccordion.animate({height:option.defaultSize.height},'slow','',AfterExpand);
currentAccordion.attr('name','expanded');
}
}
using this class from your main cller will be as follows:
var option = {
resizeSpeed : 8,
classNames :
{
toggle : 'section_title',
toggleActive : 'accordion_active',
content : 'section_content'
},
defaultSize :
{
width : null,
height : 230
},
direction : 'vertical',
onEvent : 'click'
};
new Accordion('container_id_name',option);
The html structure will need to like follows:
<div id="section_container">
<div class="section"><!--[if !IE]>section div start<![endif]-->
<div class="section_title">1. section 1</div>
<div name="expanded" style="height: 230px; display: block;" class="section_content" id="section1">
<!--content here-->
</div>
</div>
<!-- more sections -->
</div>
This code may have some unused code as i made this very quickly and didn't optimized later. Please do so as a self service :)
If your looking for an independent plugin, not interested to make your own, then use the following links:
Jquery accordion
or
jquery accordion 2
Subscribe to:
Posts (Atom)
