Png background fix for ie6 using css

Previous we have seen about how to give hack for png image for ie6. In this post we will be knowing how to fix a png background using css for ie6.

HTML
<div class="img_txt">dhsfds</div>

CSS
.img_txt{background:url(mobile.png) repeat;_background-image:none;_background-repeat:repeat-x;float:left;width:300px;height:130px;_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='mobile.png', sizingMethod='crop'}


Hope this will fix for the background png.

Read more...

Simple animated drop down menu using jquery

This tut will help you to have a simple animated drop down using jquery. Before using this please add the js file from jquery website. Refer the site http://jquery.com/ for more details. You can download the minified version or the developer version.

Once you download and include in the page then using the below steps.
HTML

<ul class="drospdown">
<li><a href="#">A Website #1</a></li>
<li><a href="#">A Website #2</a>
<ul>
             <li><a href="#">Indoor</a></li>
             <li><a href="#">Outdoor</a></li>
            </ul>

</li>
<li><a href="#">A Link #1</a></li>
<li><a href="#">A Link #2</a></li>
<li><a href="#">A Website #3</a></li>
<li><a href="#">A Website #4</a></li>

<li><a href="#">A Link #3</a></li>
<li><a href="#">A Link #4</a></li>
</ul>

Javascript

function mainmenu(){
$(" .drospdown ul ").css({display: "none"}); // Opera Fix
$(" .drospdown li").hover(function(){
$(this).find('ul:first').css({visibility: "visible",display: "none"}).slideDown(400);
},function(){
$(this).find('ul:first').slideUp(400);
});
}
$(document).ready(function(){
mainmenu();
});

this will give you an animated drop down menu...

Read more...