Adsense

Translate it to ur language

Sunday, December 27, 2009

Fetch all the post related to a particular tag in a page of wordpress

If you want to fetch all the post in a particular page having same tag or category keeping the basic layout same as of general blog post. We need to make a template file with the following code and upload it as tag-tagname.php (eg tag-wordpress.php)

// Declaration help in navigation in admin panel
/**
* @package WordPress
* @subpackage Default_Theme
*/
/*
Template Name: Tag Wordpress
*/
?>

// Fetch the header template


//Main content area


// query_post will fetch all the post having wordpress as tag. Change as per ur requirement



//this is same as of main index template where general post as usually shown





id="post-">





by -»





















Not Found


Sorry, but you are looking for something that isn't here.








//Footer Area

Wordpress category/tag style

If you want your category or tags to be presented in different style simple stylesheet can be added with customized classes:

.tag-tagname{} (For example i made .tag-wordpress{color:#00FF00; background-color:#000000;})
The above changes in my blog put my all the post under 'wordpress' tag to a new color and background amongst all the post of the general post page

.category-categoryname{}
The same can be adopted for category also

Saturday, December 26, 2009

3 idiots

Excellent movie just rocked my heart..................a nice movie after a long time planning to see it second time.

Friday, December 25, 2009

Merry Christmas

Wishing you all a merry christmas. May this christmas bring happiness in everyone's life.

[caption id="attachment_120" align="aligncenter" width="150" caption="Enjoy Christmas"]Enjoy Christmas[/caption]

Updated the Background

My blogs got a new look with the background behind the head ...

Monday, December 14, 2009

Inkscape Works

[caption id="attachment_114" align="aligncenter" width="150" caption="Inkscape Practice"]Inkscape Practice[/caption]

Friday, December 11, 2009

CAPTCHA

Till today I was using captcha from different third party. Then I came to know about the official portal of CAPTCHA www.captcha.net and used it in this blog in comments form. Its a nice one. Learning more about CAPTCHA. Much concerned about spam postings earlier also did lots of Client side and server side validations. Lets see how it helps.

Thursday, December 10, 2009


Inspiration Taken from this blog:
http://ryanler.wordpress.com/2007/05/23/inkscape-sticker-with-folded-edge-tutorial/

But i make it by my own method using mostly circle tool of Inkscape.

Sunday, December 6, 2009

Testing it through mail

Header by Inkscape

Friends,

The header you are seeing at my blog is done by Inkscape an open source illustration tool. Exploring more to add something more on this blog.

Friday, October 30, 2009

The Institution of Engineers(India)

Today I have been elected as Associate of the prestigious The Institution of Engineers(India).

Thursday, October 29, 2009

A new bubble added

This comments and tag part of wordpress was not that impressive so I put a bubble which i downloaded. My header image is also not covering up fully becoz I am unable to stretch it Paint is not helping me

Rounded Corners

I was looking for rounded corners then I found this portal

http://www.spiffycorners.com/index.php

Really helpful
--

Wednesday, October 14, 2009

40+ Tooltips Scripts With AJAX, JavaScript & CSS

Source: http://www.smashingmagazine.com/2007/06/12/tooltips-scripts-ajax-javascript-css-dhtml/

Web users love informative clues. Whatever questions and misunderstandings might occur – delivering precise answers immediately is the primary task a responsive user interface should be able to cope with. To do that, developers have to consider subtle and well-thought tooltips – used correctly, they can greatly improve user experience and help users to get things done. In Web such "responsive" hints can be provided by tooltips. E.g., unclear input fields in web forms are perfect examples of a situation you might be willing to use a tooltip for.

Most of solutions are JavaScript- and AJAX-based, however we've also managed to find some lightweight CSS-based solutions. To install and use the script, it's often enough to include the JavaScript library in the source code and provide the hint as plain text within the "title"-attribute. Sometimes you can also insert URLs, images, tables and further elements – basically, it can be almost everything you'd ever wanted it to be.

We'd like to thank Jurgen Koller for compiling an extensive list of tooltip scripts we've stumbled upon during our search. It gives many useful pointers, but we've managed to find some more. You might be willing to use Koller's post as a quick reference for your search.

Let's take a look at 43 handy tooltips scripts for intuitive and well-designed visual clues. It's nice to have them all in one place, once you need them. It's nice to be able to find them, once you don't have time to search for them.

Tooltips: AJAX & JavaScript Solutions

  • Nice Titles Revised
    An improved Nice Titles Tooltip Script with Accesskeys support.
    Tooltips Scripts - Nice Titles revised | Blog | 1976design.com
  • A lightweight prototype based JavaScript tooltip
    Tooltips Scripts - A lightweight prototype based JavaScript tooltip
  • Nice Titles
    A classic. The script uses a background image.
    Tooltips Scripts - Nice titles
  • AJAX-enabled Help-BalloonsHelp windows in baloon-design. AJAXified version is also available.
    Tooltips Scripts - BeauScott AJAX-enabled Help-Balloons
  • jTip – A jQuery Tool Tip
    Extensive AJAX-based tooltips with numerous functions and presentation possibilities.
    Screenshot Tooltipp
  • jQuery plugin: Tooltip
    Enhances the jQuery Library.
    Screenshot Tooltipp
  • qTip
    Works for all elements, not only for links in most browsers – IE 5.5+, Firefox, Safari and Opera.
    Tooltips Scripts - qTip › CSS › Learn › solarDreamStudios
  • Form field hints with CSS Tooltips
    t's a basic example of how helpful a little JavaScript and CSS can be in a form. Instead of the input hints always showing and potentionally cluttering a very simple form, only the hint for the currently focused input will show. This article will show a way to do this.
    Tooltips Scripts - Form field hints with CSS and JavaScript (Ask the CSS Guy)
  • JS Tooltip
    Displays customizable tool tip message for each link element on a web page. A tool tip that can be added to the anchor element unobtrusively by adding a class value to it. This was done by having the tool tip message pull from the specific title attribute of the anchor element that the tool tip was added too.
    Tooltips Scripts - Javascript Entry - Cody Lindley: Finding a Javascript Tool Tip Script
  • BoxOver
    Flexible DHTML-Tooltipp in numerous formats. Appears (almost) immedately and fades in during loading.
    Screenshot Tooltipp
  • SuperNotes
    Converts footnotes to tooltips. Appears immediately and can be assigned with a fixed position in the browser window.
    Screenshot Tooltipp
  • Tipster
    Multifunctional tool tips with JavaScript.
    Tooltips Scripts - Tipster Demonstration
  • 5 Tooltips by DHTMLGoodies
    First version is suppose to improve the usability of online forms:
    Screenshot Tooltipp
  • The second technique uses AJAX.
    Screenshot Tooltipp
  • Walter Zorns JavaScript, DHTML Tooltipps
    These tooltips can be used for different purposes; the code is well-documented and can easily be improved and modified.
    Screenshot Tooltipp
  • clueTip
    This is a demo page for the new clueTip — a jQuery-based, AJAX-powered tooltip. The clueTip plug-in was inspired by Cody Lindley's jTip script.
    Tooltips Scripts - clueTip : A jQuery Plugin
  • Mootools Tooltip
    Mootools Javascript example of using tooltips.
    Tooltips Scripts - Mootools Javascript Tooltips
  • Sweet Titles
    JavaScript Fading Tooltips.
  • Hover Tip
    Tooltip with menu-like capabilities. The tooltip layer will remain visible while the viewer hovers over it. This allows you to place clickable links inside tooltip content.
    Tooltips Scripts - Hover-Tip: Tooltip You Can Mouse Over
  • Multiline Tooltip with HTML, CSS and JavaScript
    This document explains how to make nice multiline tooltip for HTML documents, using simple and standard CSS, HTML and JavaScript.
    Tooltips Scripts - texSoft.it - multiline tooltip with HTML CSS and JavaScript
  • overLIB
    This JavaScript-library can be used in a variety of ways; many positioning and appearance features are available.
    Screenshot Tooltipp
  • Scriptaculous Effect.Tooltip
    The tooltip script from the script.aculo.us library.
    Tooltips Scripts - Effect.Tooltip
  • Tooltip.js
    Tooltipps with AJAX. The library uses the Prototype JavaScript Framework. The demo doesn't work any longer.
    Tooltips Scripts - Tooltip.js - About

CSS-Based Solutions

Further Solutions

  • Snap.com
    Snap gives you a visual preview of each result before you click on it. And that improves your odds of picking the right search, without clicking back-and-forth several times.
    Tooltips Scripts - Snap
  • DHTML Tooltips
    Popup a help tip or information layer onmouseover using this object-based DHTML tooltip code. The basic version, presented on this page, can contain plain text or rich html, images, or images and text. The tooltip can be displayed over a background image. It can move with mouse movement. And it is easy to customize and modify.
    Tooltips Scripts - DHTML Tooltips: Pop-up Layer Onmouseover
  • Animated Tooltip Javascript
  • DOM Tooltip
    DOM Tooltip Script-Library
  • Yahoo! UI Library: Tooltip
    The Yahoo! UI Library Toolbox provides among other functions also tooltips.

Tooltips: Wordpress-Plugins

  • WP – Bubble Tooltips (Plugin)
    A Wordpress-Plugin can change the appearance of links. Based on Bubble Tooltipps developed by Web-Graphics.
    Tooltips Scripts - WP - Bubble Tooltips (Plugin) | bueltge.de [by:ltge.de]
  • FancyTooltips
    Further Wordpress-Plugin with similar functionality.
    Tooltips Scripts - wg:Bubble Tooltips
  • Fancy Tooltips
    Screenshot Tooltipp

Selected Scripts: Quick Overview

Tooltips Scripts - A lightweight prototype based JavaScript tooltip

Tooltips Scripts - Nice Titles revised | Blog | 1976design.com

Tooltips Scripts - Nice titles

Tooltips Scripts - BeauScott.com » Blog Archive » AJAX-enabled Help-Balloons

Screenshot Tooltipp

Tooltips Scripts - Custom CSS Tooltips - loadaverageZero

Tooltips Scripts - CSS: Menu Descriptions | Mike̢۪s Experiments | MikeCherim.com


Sunday, October 11, 2009

30+ Javascript/Ajax Techniques for Sliders, Scrollers and Scrollbars

Sources: http://www.noupe.com/javascript/30-javascriptajax-techniques-for-sliders-scrollers-and-scrollbars.html

30+ Javascript/Ajax Techniques for Sliders, Scrollers and Scrollbars

Flash Website

Every once in a while we like to focus on different design elements and how to use javascript and ajax to make them more interactive and more flexible to the user. In this article we'd like to present a list of over 30 hand-picked Sliders, Scrollers and scrollbar techniques you can use to achieve some special visual effects in your designs.

jQuery, Mootools, Prototype and script.aculo.us are used in these examples, so every taste has its demos served.

You might be interested to check some of the designs that was mentioned in the posts below:



Slider

1) Slider- Horizontal or Vertical bar and slider.


2) Simple images slider to create Flickr-like slideshows- This step-by-step tutorial explains how to customize slideshow and use it in your web projects.

  • Download Tutorialfrom Here

3) Accessible slider- Illustrations and code samples showing how to make a slider UI control accessible to those who aren't running JavaScript or CSS.


4) Accessible Unobtrusive Slider Demo- This method offer full keyboard capabilities as using unobtrusive JavaScript which is a method that separates the JavaScript behavior from the page markup.


5) Slider- Degrade gracefully for browser without the needed DOM support with full mouse and keyboard support. Skinable using different CSS files.


6) Photo Slider Tutorial- Simple to use JavaScript slide show that scrolls thumbnails as smooth as Flash. Tutorial shows how to install and configure the code. The included example uses less than 10 lines of code.


7) Accessible News Slider- Accessible News Slider is a JavaScript plugin built for the jQuery library.


8 ) Yahoo! UI Library: Slider- The Slider component is a UI control that enables the user to adjust values in a finite range along one or two axes.


9) Fireworks.js- Fireworks.js is a bit of Javascript that creates starburst-type explosions in a web document; in short, it's a fireworks effect someone could theoretically use on their site.


10) Slider Gallery- A similar effect used to showcase the products on the Apple web site. This 'product slider' is similar to a straight forward gallery, except that there is a slider to navigate the items, i.e. the bit the user controls to view the items. Simple stuff.


11) 2J News Slider – Joomla Ajax Slider- This is an eye-catching news slider that bring in evidence your content.


12) Inline Range Slider


13) Ajax Image Sliders Part 2: Intervals with On Demand


14) Multiple Sliders in one page


15) Slider Using PHP, Ajax And Javascript- A slider script implemened in Ajax with PHP.


16) Coda-Slider- Amazing jQuery Coda-Slider can be used for Nice, slick content presentation.


17) jQuery Multimedia Portfolio- This plugin for jQuery will automatically detect the extension of each media and apply the adapted player. with a nice slider to move through the files.


Scrollers

18)Ultimate JavaScript Scroller and Slider- This versatile and lightweight JavaScript makes it easy to scroll text blocks, create slideshows, slide between content, create tickers and more.


19) df Javascript Smooth Scroll- A super small Smooth Scrolling Javascript. This script is too simple to understand and use. Nothing but playing with Anchor Tags. Include the Javascript and you are set to smoooooooooth scroll.


20) jQuery.SerialScroll- This plugin allows you to easily animate any series of elements, by sequentially scrolling them. You can use it as a section slider, text scroller, slideshows, and news ticker.



22) Easy Scroll: Accessible Content Scroller- Easy Scroll is standalone, lightweight script that is very easily applicable developed by Alen Grakalic.


21) Scrolling Div Content with Graphical Scrollbars- Scroll div content vertically or horizontally, onmouseover, onmousedown, onmousewheel or with a gliding motion onclick. Graphical scrollbars and multiple instances supported. Scroll areas can be positioned absolute or relative. New content can be swapped in and updated via ajax. Many more features and extras.


22) Scrollable content - Display content in a confined area. Users can view the entire content via the custom scroll up/down images.


23) Pamoorama- Basically what it does is to show only a part of your fullsize image. The image can then be scrolled by moving the mouse over it. Pamoorama will also display a small thumbnail of your panorama with a small window/frame so you can see which part of the image is visible right now. Dragging this little window is also possible!


24) How To Unobtrusively Scroll A Div With Prototype & Scriptaculous- The goal of this example is to see if scrolling effects can be possible while retaining legacy compliance and insuring "bookmarkability".


25) mooSlideBox 3- mooSlideBox v3 is a small and slim ajax based extension or replacement of the common "lightbox" that can be found on nearly every page. This lightbox clone works in IE 6/7, Opera and Firefox.


26) jqGalScroll v2.1 (Photo Gallery)- jQuery Gallery Scroller (jqGalScroll) takes list of images and creates a smooth scrolling photo gallery scrolling vertically, horizontally, or diagonally. The plugin will also create pagination to allow you to flow through your photos.


27) DHTML Scroller- This script can load a file into a div, and scroll it via simple function calls and a fully draggable and sizeable scrollbar. It's small and quite fast to load its content.


Stunning Custom Scroll Bars

28)Mootools Styled Scrollbar- This is an example how to make your own styled scrollbar using Mootools


29) FleXcroll- Flexible and Accessible Custom Scroll Bars. A Cross Browser* and Standards Compliant Custom ScrollBar Script by Hesido.


30)Slider Demos- An extensive set of slider demos.


31)jsScrollbar- It's hard to find a good javascript scroller, check this demos and your scrollbar issues will be solved.