Monday, July 28, 2008

Site Review: FontTester.com


Font Tester is a free online font comparison tool. It allows you to easily preview and compare different fonts side by side with various CSS font styles applied to them. It is very useful for web developers who are looking for just the right font/style/color to use in their pages. To use it all you have to do is simply enter the text you would like to preview, modify the various CSS properties until you find a style you like, and then click on the Get CSS Code button to generate all the necassary CSS code to reproduce those styles in your webpage.

It allows you to preview in real-time all of the available CSS font properties and includes a real-time color picker for choosing just the right color (and background color) for your text. The color picker also supports direct editing of the HSV and RGB values and includes over 1,000 pre-defined colors for you to choose from. As an added bonus, Font Tester also comes with a handy character map which you can use to quickly find the corresponding HTML Entity for a particular character.

FontTester Home

Wednesday, July 9, 2008

More Security on Gmail now


This is what is expected since long.May be Gmail is safe as we think but excessive usage of Ajax and java script can be injurious to privacy and security!

I read this on gmailblog.They have added support for remote log off now.If you had logged in from another PC last time and forgot to log off,next time it will show you the IP address with a link for more details. On details, you will get more details regarding concurrent access to the account and recent activities.Which will show account type, access type and IP addresses with time of access.

More @ GmailBlog

Wednesday, May 14, 2008

Blogger: Most visited posts widget script...

This script finds your most visited posts and gives you back theresult in html.I found this from bloggerbuster and it uses pipes.yahoo.com to get the ratings.
So now you don't need to put your features post links.Just put the script in new widget,change the url,change the number of posts you want to show, and done!
<script type="text/javascript">
function pipeCallback(obj) {
document.write('<font ><ol style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol></font>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback
&_id=1cf38ae68efbe859c4ba1ee239cec099&url=http%3A%2F%2Fwww.techlads.com&num=10" type="text/javascript"></script>

In the url, only below part is important. Change the url to your one and change the num param to what you want.I made it only top 10 posts.
url=http://www.techlads.com&num=10

Wednesday, May 7, 2008

Review - KillerTechTips.com


Killer Tech Tips is a blog where you can find interesting and useful information on software and web tools that are useful for people who are not just based on computers, but also for people who are non-professional IT guys.

This blog is maintained by a 16 year old lad named Shankar Ganesh.
The topics here range from blogging tips to computers to security to mobile phone, etc etc - You name it and you will find it there. Worth a try to visit the site. Homepage

Friday, April 4, 2008

curvyCorners - javascript for rounded corners


curvyCorners is a free JavaScript program that will create on-the-fly rounded corners for any HTML DIV element, that look as good as any graphically created corners.
Features:
* Free
* Easy to use JavaScript object
* Requires no images or image editing
* Full Anti-Aliasing support
* Anti-Aliasing over graphical backgrounds
* Background-image support (round corners of images)
* Fluid height/width support
* Solid border support, any colour/width with Anti-Aliasing
* User defined per corner radiuses
curvycorners.net

Wednesday, February 20, 2008

Reviews: Starbox - rating stars for prototype

Starbox allows you to easily create all kinds of rating boxes using just one PNG image. The library is build on top of the Prototype javascript framework. For some extra effects you can add Scriptaculous as well. Check the demos below to see what Starbox is all about and read on for more information on how to customize your own Starboxes.

Features:

  • Rerating allows you to adjust your previous rating.
  • You can easily save your rating with Ajax using the build in callback.
  • Improvements to the CSS model, allowing you to style the Starbox based on status (hover, rated and locked).
  • Better seperation of Javascript, CSS and images.
  • A ghosting bar that tracks your average.
  • Custom event 'starbox:rated' is fired when your rate.
  • Batched building of Starboxes based on cached overlay images.

Tuesday, February 19, 2008

Reviews: Modalbox - javascript modal dialog/popup library

ModalBox is a JavaScript technique for creating modern (Web 2.0-style) modal dialogs or even wizards (sequences of dialogs) without using conventional popups and page reloads. It’s inspired by Mac OS X modal dialogs. And yes, it may also be useful for showing larger versions of images.


ModalBox is built with pure JavaScript and is based on Sam Stephenson’s excellent Prototype JavaScript Framework, script.aculo.us and valid XHTML/CSS. ModalBox uses AJAX to load content.

more @ wildBit.com

Friday, February 15, 2008

Java - Javascript interaction

Many of us using javascript in daily coding.I am a java developer and using ajax with applet also.And i need to call applet methods from javascript.

Actually i knew this while i was facing a strange problem (ofcourse it was strange for me becasue i was not aware of this!). The applet used is compiled in JRE 1.4.0.And whenever anyone having JRE version newer than 1.4.0 tried accessing that applet, the call from javascript to applet method gives error "Object doesn't support this property". So i was very much tired of compiling applet with different versions of Jre but no luck.

So once i found the <param> tags for <Object> element which is now used for applet in HTML code.And then i used these tags for java and javascript interaction.

we will look at what parameters we should use the applet and object tags to 'switch on' the java-js communications.

According to the java 5 documentation, if you use the APPLET tag, you do not need any special parameters to allow a javascript to call the applet's method. On the other hand if you use the OBJECT tag you need to use the scriptable parameter. Things use to be slightly different in the older versions.

For an applet to call javascript methods, all you need to do is add the mayscript parameter

so the tags are

<object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93"
width= "290" height= "290" style="border-width:0;" id="rup" name="rup"
codebase="http://java.sun.com/products/plugin/autodl/
jinstall-1_4_1-windows-i586.cab#version=1,4,1">

<param name="archive" value="jsapplet.jar">
<param name="code" value="com.raditha.articles.JSHelloWorld">
<param name="mayscript" value="yes">
<param name="scriptable" value="true">
<param name="name" value="jssapplet">
</object>


The object tag can actually cause the most recent version of the java plug in to be downloaded if the user does not have it installed or if the version present is older than the minimum requirement (in this case 1.4.1). If you want to be able to do the same for Netscape Navigator the object tag has to change slightly:


<object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93"
width= "290" height= "290" style="border-width:0;" id="rup" name="rup"
codebase="http://java.sun.com/products/plugin/autodl/
jinstall-1_4_1-windows-i586.cab#version=1,4,1">

<param name="archive" value="jsapplet.jar">
<param name="code" value="com.raditha.articles.JSHelloWorld">
<param name="mayscript" value="yes">
<param name="scriptable" value="true">
<param name="name" value="jsapplet">
</object>


Calling applet method from javascript is simple. You just need to do document.getElementById("appletid").methodName();
But calling javascript from Applet is somewhat tricky.

In order to call javascripts we need to get hold of a JSObject. But first things first, we need to import the netscape.javascript.JSObject into our class.

public void init()
{
jsObj= JSObject.getWindow(this);
}


All that remains to do is to add the JButton to our applet. Then we add an ActionListener to the JButton, and it's actionPerformed method calls the javascript.


public void actionPerformed(ActionEvent e) {
if(jsObj != null )
try {
jsObj.call("updatePage", new String[] {txt.getText()});
}
catch (Exception ex) {
ex.printStackTrace();
}
}


thats it! it will call the method from jsObj.

hope this helps someone like me for first time.Enjoy!

Wednesday, December 5, 2007

Coloured Labels Now Available on Gmail

Back in the Paleolithic Era, the world was a very different kind of place. People were hunter-gatherers, lived in caves, and kept all their email in folders*. You can't really blame them. Between tracking woolly mammoths, fashioning crude stone tools, and auditioning for commercials, having a highly tuned system for organizing email wasn't their highest priority.

But people changed. We moved out of caves and into skyscrapers. We hunt for bargains at the corner grocery. And we play video games simulating ourselves playing video games.

Today, we're happy to announce the next evolution of labels: the colored label. Until now the label has been a little inconspicuous creature, subtly suggesting categorical associations in its simple green coat. Oh, we've seen the colored label here and there, its precursors surfacing in various experiments and Greasemonkey scripts; but the label has never before been so brazen, so bold. How will it use its new colors? Will it disguise itself with the chameleon's camouflage or clamor for attention with the monarch butterfly's vivid contrast?

Official Gmail Blog

Monday, October 15, 2007

Eclipse offers AJAX server

The Eclipse Foundation will make available Monday Eclipse RAP (Rich Ajax Platform) 1.0, an AJAX (Asynchronous JavaScript and XML) server for building and deploying rich Internet applications. Leveraging the Eclipse component model that based on the OSGi (Open Services Gateway initiative) standard, RAP 1.0 is suited for enterprises and enables development of component-based applications that can integrate with existing systems. RAP 1.0 is freely downloadable.

With RAP, developers can build AJAX applications "completely in Java," said Jochen Krause, project leader for RAP at Innoopract."The benefit is many developers know [how] to write Java code," he said. "If you look at enterprise IT, you find very few people that are seasoned in JavaScript."

infoWorld

Thursday, October 11, 2007

Blogger - Transform 2-column Template to 3-column

People are always curious about how to use maximum space on blogger. The default templates are very simple and disgusting. We need something new after all. So take any template from blogger or another where you can get blogger compatible templates. And then do changes as per the instructions.

First goto your HTML template code and save it in your machine before starting changes.

Find

#header-wrapper {
in your HTML code

Change value for width like width:860px; if its small value.This will make your blog's width wide and gives you more space fro your content and ads.By default width is about 660 pixels.

Find

#outer-wrapper {
width: 860px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}

#main-wrapper {
width: 410px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper {
width: 210px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float
*/
}

#left-sidebar-wrapper {
width: 210px;
float: left;
word-wrap: break-word;
overflow: hidden;
}

and colored lines are changes or new additions. here left-sidebar-wrapper is for new sidebar. I have changed the widths as per total width of 860 pixels. For example 2 sidebars, each of 210 pixels(by default it is 220) and main post column is of 410 pixels.

Find
<div id="content-wrapper"> and add below code after this line

<div id="left-sidebar-wrapper">
<b:section class="sidebar" id="sidebar1" preferred="yes">
</b:section>
</div>

Now save your template and goto Layout tab.

You will get new sidebar in design. Then you can add your new widgets in it. Use your whole blog.manage all your data as you wish. You can make it more wider if you need.

Tuesday, September 11, 2007

Best4c(Best for chart) - Web-based, online diagram tool

Best4c(Best for chart) is a Web-based, online diagram tool that allows you to create, edit and share charts anytime, anywhere.


· Offers you a way to create and share charts online. No software installation. No downloads.

· Provide an interactive drawing and diagramming solution within all popular internet browsers (FireFox,IE,Opera,Safari).

· Desktop application feel in a web-based diagramming solution.

· Create many types of diagrams such as Flowcharts, Floor plans, Network diagrams, or any other simple drawing or diagram.

Best4c.com

Monday, June 11, 2007

wForms - A Javascript Extension to Web Forms

wForms is an open-source, unobtrusive javascript library that adds commonly needed behaviors to traditional web forms without the need for any programming skill.

Download @ Here

Wednesday, June 6, 2007

Blogger hack - post body background

In blogger,we can change many colors and fonts from the "fonts and colors" tab. But you know that you can add as many members in that list as you wat?

in the code you will fine tags "<variable ... >" having different arguments.You can add your new variable in that list and it will be shown in the drop down list of "fonts and colors" tab.You can use the variable with the syntax '$varname' (dollar sign and variable name in sequence).

As an example, i will show for post body background color.

add below code to you variable tags list.
<Variable name="postBackColor" description="Post Body Background Color"
type="color" default="#fffafa" / value="#ffffdd">
This is for the background color of post body.

so find and change the code like below.
.post {
margin: 0 0 30px 0;
font-size: 100%;
background:$postBackColor;
}
so now you can change post bgcolor from the tab and..you are done!

will post more hacks as i find them..These are very simple ones...but it takes time when you so it first time.Then your mind will make a way for changes!

Blogger hack - 3 column hack code

i know you can find css hacks of new blogger on any site. But they are just half the way. I mean they shows only some changes and your total view will be not same.I have faced the problem while i was doing 3 column change in the new blogger template.They only showed how to make new sidebar and where to put it.Then i have to do some searching on web for CSS changes!

here i m discussing 3 column change for new blogger which i have successfully done!

first of all copy your HTML code of the template to some Editor and after taking backup,do changes in it.

where to add code for sidebar?

first find the code,

div#sidebar-wrapper {
margin: 0px;
padding: 0px;
text-align: right;
}

div#sidebar {
width: 300px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

after that add copy and paste it and then change it names like...


div#right-sidebar-wrapper {
margin: 0.1px;
padding: 0px;
text-align: left;
}

div#right-sidebar {
width: 140px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
Then find your original sidebar class in css, like find "#sidebar".
For it, many css templates will be found in which different settings for lists,links,fonts are done.
copy same settings for your new sidebar names "#right-sidebar", so your both sidebars will be same.All settings for both will be same.

Then find code in template HTML,

<a href='#main'>skip to main </a> |
<a href='#sidebar'>skip to sidebar</a>
And before this add line "<a href='#right-sidebar'>skip to right sidebar</a> |" so your total code will be

<a href='#right-sidebar'>skip to right sidebar</a> |
<a href='#main'>skip to main </a> |

<a href='#sidebar'>skip to sidebar</a>
Then find "<div id='content-wrapper'>" line and add below code after that with empty <b:section> tag.

<div id='right-sidebar-wrapper'>
<b:section class='right-sidebar' id='right-sidebar' preferred='yes'></b:section>
</div>


You are done! Your blog will have 3 columns now...1st sidebar, main in the middle and then 2nd sidebar!

Thursday, May 31, 2007

Prototype - Best JavaScript Framework!

Prototype is a JavaScript Framework that aims to ease development of dynamic web applications.

Featuring a unique, easy-to-use toolkit for class-driven development and the nicest Ajax library around, Prototype is quickly becoming the codebase of choice for web application developers everywhere.

Home Page

Google Gears...Great thing!

Google Gears (BETA) is an open source browser extension that enables web applications to provide offline functionality using following JavaScript APIs:

Store and serve application resources locally

Store data locally in a fully-searchable relational database

Run asynchronous Javascript to improve application responsiveness

Home Page

Friday, May 11, 2007

Increasing User Experience With Javascript

Using the javascript library MooTools with some other free libraries, this tutorial series teaches how to increase user experience with some simple javascript. Using a fictional "blog" as the test site, subscribers will learn how to enhance the blog with modern web techniques such as:
  • LightBox type photo gallery
  • Expanding sub-menus
  • AJAX loaded pages
  • Sliding image menus
  • Reflecting images without having to touch Photoshop
  • Condensing a web page with Fx.Styles and Sliding Tabs
  • ...and more
Full artcile @ Here

Wednesday, March 21, 2007

Microsoft joins AJAX alliance

Microsoft Corporation has joined the OpenAjax Alliance, a group focused on accelerating the use of Asynchronous JavaScript and XML technologies. Microsoft said it agreed to join the alliance to work with other vendors to evolve AJAX, a method of rich Internet applications that ensure interoperability. The company said that its membership in the alliance is another indication that it wants to provide Web developers with technology that works across different browsers and platforms.

The alliance also announced that it has signed up 30 new members in recent weeks, bringing the total to 72 vendors. The group was formed last February to create a set of requirements for AJAX technologies, products and applications to ensure interoperability among tools built by different vendors. The group also wants to create requirements that can speed delivery times and cut the cost of Web 2.0 applications. In addition to working on the interoperability standards, the group has formed task forces to address AJAX security, IDE integration, server integration and client-side server communications, said David Boloker, chairman of the OpenAjax steering committee.

Source: ComputerWorld

Wednesday, March 14, 2007

Get rid of rapidshare.de and rapidshare.com counter/timer

I have tried many softwares which can download from raidshare. But nothing works fine.Finally, i have tried to see page source.And trying to resolve the javascript.And i got it friends.

yes, you can easily stop the waiting timer (or counter) which stucks you for somw time before download the file.Just type this line in Address bar of your browser.And ya, if you are usinf FireFox then enable javascript before doing this.

in address bar: javascript:alert(c);


This will show value of the variable named 'c' in the page.To change its value, you need to call it in void function.

in address bar: javascript:void(c=0);


This will set c to 0 and wow, you will see the link!

it works fine with rapidshare.de and .com both, but since some day, rapidshare.de has got the security.so if you do it, your download link will appear but when you click it will show error message.