Magento - Tips and Tricks

1.html
<div id="scroll-to-top" style="display:none">Back to Top</div>

2. JS
<script language="javascript">
jQuery(function() {
jQuery(window).scroll(function() {
if(jQuery(this).scrollTop() != 0) {
jQuery('#scroll-to-top').fadeIn();
} else {
jQuery('#scroll-to-top').fadeOut();
}
});

jQuery('#scroll-to-top').click(function() {
jQuery('body,html').animate({scrollTop:0},800);
});
});
</script>

3.CSS

#scroll-to-top {
display:none;
position:fixed;
width:50px;
height:50px;
bottom:30px;
right:30px;
z-index:9999;
text-indent:-9999px;
border-radius:50%;
background-color: #e5e5e5;
}
#scroll-to-top:hover {
background-position:-200px -150px;
background-color:#333;
}

Posted by Bhoopendra Dwivedi at 5:51 AM 0 comments

Labels: html, Javascript

Use html as
<input type="text" value="password" id="password">

And use script
jQuery( document ).ready( function(){

jQuery( document ).delegate( "#password", "focusin focusout",
function(e){
var elm = jQuery( "#password" )[0];
if( e.type == "focusin" && elm.type == "text" ) {
jQuery( elm ).replaceWith( jQuery( "<input>", {id: "password", type:"password", value:"" } ) );
jQuery( "#password")[0].focus();
}
else if( e.type =="focusout" && elm.type == "password" && !elm.value ) {
jQuery( elm ).replaceWith( jQuery( "<input>", {id: "password", type:"text", value:"password" } ) );
}

}
);
});

Posted by Bhoopendra Dwivedi at 11:17 PM 0 comments

Labels: html, Javascript