Thursday, 26 September 2013

HTML5 Shining Effect with image

Monday, 16 September 2013

Tooltip script function

<script>
function refreshTooltip() {
    $('.tooltip-questionmark').tooltip({
        position: {
            my: "center bottom-20",
            at: "center top",
            using: function( position, feedback ) {
                $( this ).css( position );
                $( "<div>" )
                    .addClass( "arrow" )
                    .addClass( feedback.vertical )
                    .addClass( feedback.horizontal )
                    .appendTo( this );
            }
        }
    });
    $('.tooltip-pageyourself').tooltip({
        content: function () {
            return $(this).prop('title');
        },
        position: {
            my: "center bottom-20",
            at: "center top",
            using: function( position, feedback ) {
                $( this ).css( position );
                $( "<div>" )
                    .addClass( "arrow" )
                    .addClass( feedback.vertical )
                    .addClass( feedback.horizontal )
                    .appendTo( this );
            }
        }
    });
};
$(document).ready(function() {
    refreshTooltip();
    // Init placeholder function for browser that doesn't support it
    $('[placeholder]').defaultValue();
});
</script>

Friday, 6 September 2013

Bootstrap templates

Bootstrap templates


Free Bootstrap template

Border Radius for IE

BorderHYPERLINK "http://pxtoem.com/" HYPERLINK "http://pxtoem.com/"RadiusHYPERLINK "http://pxtoem.com/" HYPERLINK "http://pxtoem.com/"forHYPERLINK "http://pxtoem.com/" HYPERLINK "http://pxtoem.com/"IE

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://malsup.github.com/jquery.corner.js"></script>
avascript:
$('.box').corner();
HTML:
<div class="box">Hello</div>
CSS:
box{
  width:150px;
  height:28px;
  padding:10px;
}

On Mouse Over show hid div Jqeury

On Mouse Over show hid div Jqeury

<!------on mouse over show----------->
$("#ADDropdownLink").mouseenter(function() {
      $("#ADDropdown").show();
}).mouseleave(function() {
      $("#ADDropdown").hide();
});
<!------on mouse over show----------->

Show and Hide function with Jquery

Show and Hide function with Jquery

Use after close head tag

<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("p").hide();
  });
  $("#show").click(function(){
    $("p").show();
  });
});
</script>


Use after in body tag

<div id="show">Show</div>
<div id="hide">Hide</div>
<p>Your Content is Showing</p>

Show and Hide function with element

Show and Hide function with element

<script type="text/javascript">
<!--
    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }
//-->
</script>

<a href="#" onclick="toggle_visibility('foo');">Click here to toggle visibility of element #foo</a>
<div id="foo">This is foo</div>

Show and Hide function with element you can use multiple ID.

HTML5 Script for IE

HTML5 Script for IE

<!--[if IE]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->


Insert HTML5 Shiv Script after close head tag.

How to Import CSS in CSS

How to Import CSS in CSS

@import url("import1.css");

JQuery HTML script

Basic HTML and CSS

PX to EM converter

PX to EM converter




A online tool for convert px to em.

Bootstrap Tutorial

3D Vector character free download

Photoshop Silhouettes, Illustrator Silhouettes

Photoshop Shape

HTML5 and CSS3 Forms

HTML5 form and CSS3 form


httpHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"://HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"dailydesignnotesHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/".HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"comHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"/HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"webHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"-HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"designHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"/12-HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"awesomeHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"-HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"htmlHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"5-HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"cssHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"3-HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"phpHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"-HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"contactHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"-HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"formHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"-HYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"elementsHYPERLINK "http://dailydesignnotes.com/web-design/12-awesome-html5-css3-php-contact-form-elements/"/

Image zoomer for pdoduct detial page

How to make css height for chrome, Hot to make css width for chrome,

CCS3 Height and width

.calc {
	width: 100px;
	height: 50px;
	border: 1px solid #f00;
	padding: 10px;
	
	/* Firefox */
	width: -moz-calc(75% - 50px);
	/* WebKit */
	width: -webkit-calc(75% - 50px);
	/* Opera */
	width: -o-calc(75% - 50px);
	/* Standard */
	width: calc(75% - 50px);
}

CSS3 height for webkit (chrome, safari).

Different height and width for (IE firefox, safari, chrome, opera) 

HTML 5 Canvas tutorial

Animated Form with JQaury, Switching Form

Animated Form with JQeury



A  Jquery Form  with switching content, form with animated content.

Thursday, 5 September 2013

Facebook Plugin

Facebook Plugins

All types of plugin is here

Like Button

The Like button lets anyone share pages from your site back to their Facebook profile with one click.

Send Button

The Send button allows people to easily and privately send content to their friends.

Embedded Posts

Embedded Posts let you add any public post from Facebook to your blog or web site.

Follow Button

The Follow button lets other people follow a person's public updates on Facebook.

Comments

The Comments plugin lets people comment on any piece of content on your site.

Share

The Share Dialog lets users add a comment and customize the title and thumbnail of the link they share.

Activity Feed

The Activity Feed plugin shows users what their friends are doing on your site through likes and comments.

Recommendations

The Recommendations plugin gives users personalized suggestions for pages on your site they might like.

Recommendations Bar

The Recommendations Bar allows users to like content, get recommendations, and share what they’re reading with their friends.

Like Box for Pages

The Like Box enables users to like your Facebook Page and view its stream directly from your website.

Registration

The registration plugin allows users to easily sign up for your website with their Facebook account.

Facepile

The Facepile plugin displays the Facebook profile pictures of users who have liked your page or have signed up for your site.

HD wallpaper for your website design

Free HD images for your website design

Free HD images for your website design



Corbis Images
A website of free hd images for your website design  

Best and Creative Typography Design examples for your inspiration

25 Examples of Footers in Web Design

50 Excellent footer design for website

Website footer 16 Great

Footer for website


http://www.creativebloq.com/web-design/10-superb-website-footers-take-inspiration-1131597

 Inspiration for footer of your website. You can get more inspiration of footers.

Online check validation

Online check validation

Check your validation online, you can check your validation online and download script of validation.

CSS3 Animated Gears

CSS3 animated gears, a animation in css3


http://www.script-tutorials.com/css3-animated-gears/

Best animation in css3, you can also happy from this animation.

CSS Scroller, CSS3 Scroller

Stylize scroller with CSS3

http://css-tricks.com/custom-scrollbars-in-webkit/

Css Scroller this scroller only work in chrome and safari, not working in firefox, IE and opera.