article

Friday, April 30, 2010

Transforming the Button Element with Sliding Doors and Image Sprites

Transforming the Button Element with Sliding Doors and Image Sprites

create a a cross-browser, flexible and attractive button using the sliding doors technique and image sprites for fast hover changes and less HTTP requests.

http://techblog.procurios.nl/k/618/news/view/33023/14863/Transforming-the-button-element-with-sliding-doors-and-image-sprites.html

http://dl.dropbox.com/u/3293191/CSS/button.zip

Nested Side Bar Menu in Javascript

Nested Side Bar Menu in Javascript

a simple looking multi level side menu. Markup wise it’s just a regular nested UL list, turned into a drop down menu using a very small JavaScript code.

If you want to know more and download the source follow the link below

http://www.dynamicdrive.com/style/csslibrary/item/nested_side_bar_menu/

CSS Uniquely Designed Web Form Styles

CSS Uniquely Designed Web Form Styles

This is great free resource from CSS Globe, 5 downloadable uniquely designed and coded web form styles.

If you want to know more and download the source follow the link below

http://cssglobe.com/post/3875/cssg-collections-web-forms

Demo

http://cssglobe.com/collections/forms/

Download

http://cssglobe.com/collections/forms/forms.zip

http://dl.dropbox.com/u/3293191/CSS/Web%20Forms.zip

CSS Niceforms

CSS Niceforms

Niceforms is a script that will replace the most commonly used form elements with custom designed ones. You can either use the default theme that is provided or you can even develop your own look with minimal effort.

If you want to know more and download the source follow the link below

http://www.emblematiq.com/lab/niceforms/

Demo

http://www.emblematiq.com/lab/niceforms/demo/v20/niceforms.html

Beautiful CSS buttons with icon set

Beautiful CSS buttons with icon set

design nice clean buttons using some lines of HTML, CSS code and proxal icon set.

If you want to know more and download the source follow the link below

http://woork.blogspot.com/2008/06/beautiful-css-buttons-with-icon-set.html

http://dl.dropbox.com/u/3293191/CSS/nicebutton.zip

Thursday, April 29, 2010

Facebook Style Footer Admin Panel

Facebook Style Footer Admin Panel

Learn how to recreate the Facebook footer admin panel with CSS and jQuery.

http://www.sohtanaka.com/web-design/facebook-style-footer-admin-panel-part-1/

Styling Buttons and Toolbars with the jQuery UI CSS Framework

Styling Buttons and Toolbars with the jQuery UI CSS Framework

create and style a basic button with the jQuery UI CSS framework, they also offer some downloadable button examples, that demonstrate how to effectively incorporate the power of the CSS framework classes in a custom widget.

If you want to know more and download the source follow the link below

http://www.filamentgroup.com/lab/styling_buttons_and_toolbars_with_the_jquery_ui_css_framework/


Cool 3D Ribbons Only Using CSS3

Cool 3D Ribbons Only Using CSS3

You will be using box-shadow to create a drop-shadow with RGBa, border-radius and the transform property for the single items of the list to make a nice 3D effect.


http://www.pvmgarage.com/en/2010/01/how-to-create-depth-and-nice-3d-ribbons-only-using-css3/

Demo

http://www.pvmgarage.com/downloads/ribbon/

Create Skype-like buttons using jQuery

Create Skype-like buttons using jQuery

If you use Skype I am sure that you noticed that animated button for adding more people to a chat. When you click on it the icon on the left “jumps” for a few times. I love that animation. And that’s why I’m going to show you how to create the same button using jQuery and some simple CSS.

If you want to know more and download the source follow the link below

http://www.jankoatwarpspeed.com/post/2009/03/11/How-to-create-Skype-like-buttons-using-jQuery.aspx

Demo

http://www.jankoatwarpspeed.com/examples/skype_buttons/

Wednesday, April 28, 2010

Recreating the OS X Dock with CSS

Recreating the OS X Dock with CSS

If you want to know more and download the source follow the link below

http://www.zurb.com/playground/osx-dock

Create a Slick Menu using CSS3

Create a Slick Menu using CSS3

In this article the developer attempts to mimic the navigation menu on the Dragon Interactive website using only CSS (no images, and no JavaScript).
As with most of the tutorials in this article, this is an experimental tutorial using the new features of CSS3. The effects can be seen in only the latest Webkit Browsers, as such, the gradients work in Firefox 3.6 but not thefade-in and fade-out transition.

If you want to know more and download the source follow the link below

http://blog.insicdesigns.com/2010/02/create-a-slick-menu-using-css3/

Demo

http://insicdesigns.com/demo/css3/exp2/index.html

Sponsor Flip Wall With jQuery & CSS

Sponsor Flip Wall With jQuery & CSS

create a flipping sponsors page. The resulting code can be used to showcase your clients or portfolio projects with a neat flipping animation.

If you want to know more and download the source follow the link below

http://tutorialzine.com/2010/03/sponsor-wall-flip-jquery-css/

Demo

http://demo.tutorialzine.com/2010/03/sponsor-wall-flip-jquery-css/demo.php


Tuesday, April 27, 2010

Prototype LightBox 2

Prototype LightBox 2

Lightbox is a simple, unobtrusive script used to overlay images on the current page. It’s a snap to setup and works on all modern browsers.

If you want to know more and download the source follow the link below

http://www.huddletogether.com/projects/lightbox2/#overview

A fancy Apple.com-style search suggestion

A fancy Apple.com-style search suggestion

If you want to know more and download the source follow the link below

http://www.marcofolio.net/webdesign/a_fancy_apple.com-style_search_suggestion.html


Demo

http://qpoit.com/marcofolio_demo/apple_search/

Simply Buttons

Simply Buttons

simply buttons offers better looking and behaving buttons across all browsers. It does not need a javascript framework and is very easy to install and use.

If you want to know more and download the source follow the link below

http://www.p51labs.com/simply-buttons-v2/

http://dl.dropbox.com/u/3293191/simply-buttons-v2.zip

Build An AJAX Powered Shopping Cart

Build An AJAX Powered Shopping Cart

The goal of this tutorial is to show you how to build an AJAX powered shopping cart.

If you want to know more and download the source follow the link below

http://net.tutsplus.com/javascript-ajax/build-an-ajax-powered-shopping-cart/

Demo

http://net.tutsplus.com/javascript-ajax/build-an-ajax-powered-shopping-cart/

Sunday, April 25, 2010

How Configure or connect Zen Cart with phpBB forum

How Configure or connect Zen Cart with phpBB forum





1. Install phpBB and test that it works properly. For ease of configuration, it's recommended to install phpBB to the root
of your server, perhaps like this:
'http://mysite.com/forums
or
'http://mysite.com/phpbb
2. Edit the /includes/configure.php file for Zen Cart and enter the path to your phpBB folder on this line:


//define('DIR_WS_PHPBB', '/home/users/username/public_html/phpBB3/');
//define('DIR_WS_PHPBB','/home/users/billy123/public_html/forum'); //live path
define('DIR_WS_PHPBB', 'H:/R_EDNALAN/PROJECT/ZENCART/phpBB3/'); //local path


3. In Zen Cart's Admin area, go to Configuration, My Store, and set "Enable phpBB Linkage?" to TRUE
4. Now any new users created will be asked to select a forum username during signup.

Wednesday, April 21, 2010

AJAX-ed Todo List With PHP, MySQL & jQuery

AJAX-ed Todo List With PHP, MySQL & jQuery

In this tutorial we are making a simple AJAX-ed Todo List App, with PHP, MySQL and jQuery. In the process we are going to demonstrate PHP’s OOP capabilities, play with jQuery UI and implement some nice AJAX functionality.

http://tutorialzine.com/2010/03/ajax-todo-list-jquery-php-mysql-css/



Demo

http://demo.tutorialzine.com/2010/03/ajax-todo-list-jquery-php-mysql-css/demo.php


cometchat

cometchat

If you want to know more follow the link below

http://www.cometchat.com/

Demo

http://www.cometchat.com/demo

Chat Facebook Style jQuery

Chat Facebook Style jQuery

Everyone loves the gmail and facebook inline chat modules. This jQuery chat module enables you to seamlessly integrate Gmail/Facebook style chat into your existing website.

If you want to know more and download the source follow the link below

http://anantgarg.com/2009/05/13/gmail-facebook-style-jquery-chat/

Demo

http://anantgarg.com/chat/samplea.php

Download

http://anantgarg.com/wp-content/uploads/2009/05/jquerychat.zip

http://dl.dropbox.com/u/3293191/JQUERY/Gmail%20Facebook%20Style%20jQuery%20Chat.zip

Related Post