article

Sunday, May 30, 2010

CSS Contact Us Form

CSS Contact Us Form

























<style>
.get_a_container
{
background:#dcd9c1;
border:1px solid #000;
padding:12px;
width:25%;
}

.get_a_info
{
overflow:hidden;
background:#ebebeb;
border-bottom:1px solid #d3d3d3;
padding:10px;
line-height:18px;
color:#fffff;
}
.get_a_container_top
{
height:30px;
padding-top:9px;
background-color:#000000;
text-align:left;
color:#FFFFFF;
padding-left:5px;
font-weight:bold;
}

form.sidebar_form
{
overflow:hidden;
padding:10px;
background:#fff;
display:block;
}
.sidebar_form_title
{
font:bold 12px Arial, Helvetica, sans-serif;
color:#202222;
text-transform:uppercase;
margin:0 0 3px;
}
form.sidebar_form input
{
background:#fff;
border:1px solid #aeab91;
width:100%;
height:20px;
margin:0 0 6px;
}
form.sidebar_form textarea
{
background:#fff;
border:1px solid #aeab91;
width:100%;
height:100px;
margin:0 0 10px;
}
form.sidebar_form input.sidebar_form_submit
{
width:204px;
height:41px;
border:0;
display:block;
margin:0 auto;
cursor:pointer;
background:url(images/get_a_fr.gif) top left no-repeat;
font-weight:bold;
color:#FFFFFF;
}
</style>


  CONTACT US


  contact me and i will try to reach you as soon as possible





Demo

http://creativedesign-mind.com/r-ednalan/demo/css-contact-us-form.html

Download

http://dl.dropbox.com/u/3293191/CSS/css-contact-us-form.zip
Posted by ednalan at 9:42 PM . Under .

CSS Image hover link

CSS Image hover link








<style>
.inner_header_buttons
{
 width:206px;
 height:48px;
 padding:20px;
 position:absolute;
 top:80px;
 left:725px;
 background:url(images/seo_head.gif) top left no-repeat;
}
a.inner_header_services_btn, a.inner_header_services_btn:visited
{
 width:195px;
 height:42px;
 background:url(images/inner_he.gif) top left no-repeat;
 display:block;
 text-indent:-9000px;
 margin:0 auto 10px auto;
}
a.inner_header_services_btn, a.inner_header_services_btn:visited
{
 width:195px;
 height:42px;
 background:url(images/inner_he.gif) top left no-repeat;
 display:block;
 text-indent:-9000px;
 margin:0 auto 10px auto;
}
a.inner_header_services_btn:hover
{
 background:url(images/inner_hf.gif) top left no-repeat;
}
</style>

  Services and Prices




Demo

http://creativedesign-mind.com/r-ednalan/demo/css-image-hover.html

Download

http://dl.dropbox.com/u/3293191/CSS/css-image-hover-link.zip
Posted by ednalan at 7:25 PM . Under .

Friday, May 28, 2010

jQuery ContextMenu

jQuery ContextMenu

lightweight jQuery plugin that lets You selectively override the browser’s right-click menu with a custom one of your own.

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

http://www.trendskitchens.co.nz/jquery/contextmenu/
Posted by ednalan at 7:21 PM . Under .

Slimbox 2, the ultimate lightweight Lightbox clone for jQuery

Slimbox 2, the ultimate lightweight Lightbox clone for jQuery

Slimbox 2 is a 4 KB visual clone of the popular Lightbox 2 script by Lokesh Dhakar, written using the jQuery javascript library. It was designed to be very small, efficient, standards-friendly, fully customizable, more convenient and 100% compatible with the original Lightbox 2.

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

http://www.digitalia.be/software/slimbox2#demo

Download

http://www.digitalia.be/software/slimbox2#download
Posted by ednalan at 7:18 PM . Under .

Advanced docking using jQuery

Advanced docking using jQuery

implement multiple docking and undocking functionality.

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

Demo

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

Download

http://www.jankoatwarpspeed.com/file.axd?file=2009%2f6%2fadvanced_docking.zip

Posted by ednalan at 5:54 PM . Under .

Thursday, May 27, 2010

How to define CakePHP admin routes.

How to define CakePHP admin routes.

find file
app\config\core.php

find below code
/**
* Uncomment the define below to use CakePHP admin routes.
*
* The value of the define determines the name of the route
* and its associated controller actions:
*
* 'admin' -> admin_index() and /admin/controller/index
* 'superuser' -> superuser_index() and /superuser/controller/index
*/
Configure::write('Routing.admin', 'admin');
Posted by ednalan at 8:05 PM . Under .

Tuesday, May 25, 2010

cakephp - How remove the query results appears at the bottom

cakephp - How remove the query results appears at the bottom

find the file core.php

app\config\core.php

find above code


* CakePHP Debug Level:
*
* Production Mode:
* 0: No error messages, errors, or warnings shown. Flash messages redirect.
*
* Development Mode:
* 1: Errors and warnings shown, model caches refreshed, flash messages halted.
* 2: As in 1, but also with full debug messages and SQL output.
* 3: As in 2, but also with full controller dump.
*
* In production mode, flash messages redirect after a time interval.
* In development mode, you need to click the flash message to continue.
*/
//Configure::write('debug', 2);
Configure::write('debug', 0);

change the debug to 0 value
Posted by ednalan at 4:29 AM . Under .

Saturday, May 22, 2010

Creating a Digg style signup form with jQuery

Creating a Digg style signup form with jQuery

Digg.com is one of the most popular social networking sites, allowing you to discover and share the content all over the web. In this tutorial we are going to simulate their signup form, with unique features such as their dynamic tooltips that give you a hint on each field that is to be filled. The same approach will be adopted for displaying validation messages. How this form works? When an input field receives focus, a tooltip with a small blue icon is shown under it. On the other hand, if validation fails, an error message is shown in the same place. Both cases are shown on the screenshot below.

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

http://designshack.co.uk/tutorials/creating-a-digg-style-sign-up-form

Demo

http://www.designshack.co.uk/tutorialexamples/diggform/

Download

http://www.designshack.co.uk/tutorialexamples/diggform/diggform.zip

http://dl.dropbox.com/u/3293191/JQUERY/diggform.zip
Posted by ednalan at 10:23 PM . Under .

Friday, May 21, 2010

Jquery Star Rating widget

Jquery Star Rating widget

The Star Rating widget is a plugin for the jQuery javascript library that creates a non-obstrusive star rating control based on a set of radio input boxes or select options.

http://orkans-tmp.22web.net/star_rating/#demos


Download

http://orkans-tmp.22web.net/star_rating/#demos=&main-menu=4


Posted by ednalan at 8:37 AM . Under .

Twitter-style confirmation message with jQuery

Twitter-style confirmation message with jQuery

One of the cool ways that Twitter interacts with users (when you're not too busy seeing that pesky fail whale!) is how they display their error and confirmation messages. I especially like the clean approach and displaying the messages at the top of the page. If you're looking for a similar approach with your web application or dynamic web site, here's one way you can do it using the jQuery form & some validation.

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

http://www.skyrocketlabs.com/articles/twitter-style-confirmation-message.php

Demo

http://www.skyrocketlabs.com/categories/tutorials/twitter-style-confirmation-message/demo/index.html

Download

http://www.skyrocketlabs.com/categories/tutorials/twitter-style-confirmation-message/twitter-style-confirmation-message.zip

http://dl.dropbox.com/u/3293191/JQUERY/twitter-style-confirmation-message.zip
Posted by ednalan at 3:02 AM . Under .

toggle footer with jQuery & CSS

toggle footer with jQuery & CSS

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

http://dl.dropbox.com/u/3293191/JQUERY/jquery-css-toggle-footer.zip
Posted by ednalan at 2:38 AM . Under .

Twitter-style login with jQuery & CSS3

Twitter-style login with jQuery & CSS3

it works across all browsers...except IE6 and IE7/8 does not apply the CSS3.

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

http://www.skyrocketlabs.com/articles/twitter-style-login-with-jquery-and-css3.php

Demo

http://www.skyrocketlabs.com/categories/tutorials/twitter-style-login-with-jquery-and-css3/demo/index.html

Download

http://www.skyrocketlabs.com/categories/tutorials/twitter-style-login-with-jquery-and-css3/twitter-style-login-with-jquery-and-css3.zip

http://dl.dropbox.com/u/3293191/JQUERY/twitter-style-login-with-jquery-and-css3.zip
Posted by ednalan at 2:12 AM . Under .

Facebook-style navigation menu with jQuery

Facebook-style navigation menu with jQuery
Posted by ednalan at 2:06 AM . Under .

image rollover


image rollover






<style>
#imagerollovermenu {
width: 960px;
height: 72px;
margin: 20px 0 60px 0;
}
#imagerollovermenu a {
float: left;
display: block;
width: 140px;
height: 52px;  
text-decoration: none;
margin: 0 12px 0 0;
padding: 0;
}
#imagerollovermenu a.about {
background: url(images/menu4-sprite1.png) 0px 0px no-repeat;
}
#imagerollovermenu a:hover.about  {
background: url(images/menu4-sprite1.png) 0px -52px no-repeat;  
}
</style>



Demo

http://creativedesign-mind.com/r-ednalan/demo/image_roll_over.html

Download

http://dl.dropbox.com/u/3293191/CSS/hoverbuttons.zip
Posted by ednalan at 1:33 AM . Under .

Thursday, May 20, 2010

How to enable error reporting in php?

How to enable error reporting in php?

To avoid this issue, the below code can be placed in the php file for enabling the error message display for the particular page.


error_reporting(E_ALL);
ini_set("display_errors", 1);
Posted by ednalan at 11:22 PM . Under .

Wednesday, May 19, 2010

Animated Hover

Animated Hover get the title attribute and append it to the hover text. If you want to know more and download the source follow the link http://creativedesign-mind.com/r-ednalan/demo/Animated-Menu-Hover.html Download http://dl.dropbox.com/u/3293191/JQUERY/Animated-Menu-Hover.zip

Posted by ednalan at 6:33 PM . Under .

Entire Block Clickable

Entire Block Clickable
Posted by ednalan at 6:20 PM . Under .

Collapsible Panels

Collapsible Panels

This example shows you how to imitate the Gmail inbox panels.

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

http://www.webdesignerwall.com/demo/jquery/collapsible-panels.html

Download

http://dl.dropbox.com/u/3293191/JQUERY/CollapsibleMessagePanels.zip
Posted by ednalan at 5:56 PM . Under .

jquery Comment Management

jquery Comment Management

This one requires the Color Animations plugin.

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

http://www.webdesignerwall.com/demo/jquery/wordpress-comments.html
Posted by ednalan at 1:24 AM . Under .

Tuesday, May 18, 2010

Jquery Message Box

Jquery Message Box

a css message box that if click the login button a message box display in fade In and by clicking the close button it fade out




   <style type="text/css" media="all">
 * { padding:0; margin:0; }
 .block {
  padding-left:50px;
 }
 .block .message {
  padding: 10px 15px 10px 40px;
  margin: 10px 0;
  font-weight: bold;
  overflow: hidden;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  width:30%;
 }
 .block .message p {
  padding: 0;
  width: 93%;
  float: left;
  text-align:left;
 }
 .block .message.info {
  border: 1px solid #bbdbe0;
  background: #ecf9ff url(images/info0000.gif) 12px 12px no-repeat;
  color: #0888c3;
 }
 .block .message .close {
  display: block;
  float: right;
  width: 16px;
  height: 16px;
  background: url(images/close000.png) 0 0 no-repeat;
  margin-top: 2px;
  cursor: pointer;
  -moz-opacity: 0.7;
  opacity: 0.7;
 }

 .block_content {
  overflow: hidden;
  background: #fff;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  padding: 10px 20px 0;
  }
</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
  $(document).ready(function(){ 
    $('.block .message').hide().append('').fadeIn('slow'); //fade message

    $('.block .message .close').click(function() {
    $(this).parent().fadeOut('slow', function() { $(this).remove(); }); //close message
   });
  });
</script>

>?
 if (isset($_POST['Login'])){
  $message = "

   
Just click login, this is an example.
 
  
";
 }

?>


>? echo $message; ?>


Demo

http://creativedesign-mind.com/r-ednalan/demo/Message_box_message.php

Download

http://dl.dropbox.com/u/3293191/JQUERY/jquery_box_message.zip
Posted by ednalan at 2:02 AM . Under , .
Subscribe to: Posts (Atom)

Related Post