Bg-shape-ellipse-width

From Frontal Wiki

Jump to: navigation, search

Contents

Purpose

This style sets the width of the rounded corners of a "rounded rectangle" background-shape.


Value

The bg-shape-ellipse-width style accepts positive pixel values as well as percentage values. The default value is 0. 

bg-shape-ellipse-width: 10%;


Example

This example changes how rounded the corners of an 'img' element are on roll over. 

<style><![CDATA[
	.roundOnHover
		{			
			style-tween-ease: fl.transitions.easing.Strong.easeInOut;
			style-tween-duration: 5;
			style-tween-use-secs: false;
 
			background-color: orangered; 
			background-shape: rounded rectangle; 
			bg-shape-ellipse-width: 0px; 
			bg-shape-ellipse-height: 0px;
			padding: 30px;
		}
	.roundOnHover:hover
		{
			bg-shape-ellipse-width: 90px; 
			bg-shape-ellipse-height: 60px;
		}
]]></style>
<img class="roundOnHover" style="margin: auto;" src="/assets/images/image_9.jpg" />


See Also

  • background-shape
  • bg-shape-ellipse-height


Can Be Applied To

This style can be applied to all visual elements in particular:

Retrieved from "http://www.frontalcode.com/wiki/index.php/Bg-shape-ellipse-width"
Personal tools
Get Adobe Flash player