FRC: Flash-based Rounded Corner

-- not just rounded corner

0.2 alpha

FRC is still in alpha, and now it's just for fun, not for use. :)

FRC uses flash to created backgrounds, including rounded corners.

• The background here is not just static image, try to scroll or resize the window.

• Dynamicly loads external images(JPEG,GIF,PNG), click and wait:

  001.png 002.png003.png

• Scale-9 supported:

  

  Set the grid for scale 9:

• Blending mode supported, select to change:

  normal layer multiply screen lighten darken difference add subtract invert alpha erase overlay hardlight

• Select to change the main background:

  default 001 002 003 004 005 wow! (459KB, be patient.)

• Based on jQuery and SWFObject.

• FlashPlayer8+ needed.

• Tested on Firefox1.5 and IE6+/WIN, Opera is not supported yet. Haven't got a Mac to do the test.

Here is another block applied FRC.

How to use:

The HTML is simple, just apply a class to the block you want to be rounded:

<div class="FRC">
  <p>Another block applied FRC.</p>
  <p>blah blah blah</p>
</div>

Use CSS to load images, set the scale9 grid as well as the blending mode (more functionalities to be added here):

.style1{
  -FRC:"FRC_IMG=001.png&FRC_GRID9=50,50,125,195&FRC_BMODE=overlay";
}
.style1:after{
  display:none;
  content:"FRC_IMG=001.png&FRC_GRID9=50,50,125,195&FRC_BMODE=overlay";
  font-family:"FRC_IMG=001.png&FRC_GRID9=50,50,125,195&FRC_BMODE=overlay";
}

As you can see the CSS rules are kinda weird 'cause I don't konw how to use customized CSS yet.

Change history:

• 2006.07.30, version 0.2. Using CSS to apply settings.
• 2006.07.30, version 0.1.1. Multi-block added.
• 2006.07.28, alpha, version 0.1.

Any suggestion? Leave a comment here.

Back to web.Frontend