0
comments
Square :
#square {
width: 100px;
height: 100px;
background: orange;
}
Rectangle :
#rectangle {
width: 200px;
height: 100px;
background: orange;
}
Circle :
#circle {
width: 100px;
height: 100px;
background: orange;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
border-radius: 50px;
}
Oval :
#oval {
width: 200px;
height: 100px;
background: orange;
-moz-border-radius: 100px / 50px;
-webkit-border-radius: 100px / 50px;
border-radius: 100px / 50px;
}
...
Sunday, 30 December 2012
Friday, 28 December 2012
CSS3 : Box Shadow
CSS3 now provides us with the box-shadow property, which
can be used to create multiple shadows on any block level element
programmatically. This saves a lot of time spent in image editing
software and removes those nasty nested divs, but it isn't supported by
Internet Explorer, so what is best for us to do?
Browser support is growing of late with Mozilla (Firefox), Webkit
(Safari/Chrome/Konqueror), Opera and the IE9 Platform Preview all
offering a decent implementation of the spec, although Mozilla and
Webkit still require their respective -moz- and -webkit- prefixes (note Mozilla Firefox...
Wednesday, 12 December 2012
Javascript slideshows, carousels and sliders
Javascript slideshows, carousels and sliders
SpaceGallery
Noobslide (Based on Mootools )
SmoothGallery
jQuery Multimedia Portfolio
jCarousel
Glider
Carousel Slideshow
Multidirections Image Scroller
Pikachoose
SlinkySlider
Easy Slider
CrossSlide (Based on jQuery)
Ultimate JavaScript Slider and Scroller
SlidesJS (Based on jQuery...
Tuesday, 11 December 2012
Javascript tab plugin list
Javascript tab plugin list
SimpleTabs - Unobtrusive Tabs + Ajax (v1.0)
Perspective Tabs (Mootools)
MooTabs (MooTools)
idTabs (jQuery)
DOMTab – Navigation tabs with CSS and DOMscripting
jQuery UI Tabs
jQuery Accessible Tabs Plugin
Tabify (jQuery)
Nanotabs
jQuery Pager
jQueryGlobe
mb.tabset (jQuery)
...
Monday, 10 December 2012
Sliding div left side
Sliding div left side with jquery animate method.Following are the step to do that
JAVASCRIPT CODE
$(document).ready(function() {
$('button').click(function() {
$("#slidingDiv").animate({width: 'toggle'});
});
});
CSS CODE
#slidingDiv{
width: 200px;
height: 50px;
background-color: red;
}
HTML CODE
<body>
<button>CLICK ME</button>
<br />
<div id="slidingDiv"></div>
</body>...
Subscribe to:
Posts (Atom)