Posterous theme by Cory Watilo

Filed under: Code

Rounded corners in IE7 and IE8

I like the CSS3 PIE option for rounded corners, but am having some problems getting it to work on my Drupal site. In the meantime I opted for a JS version which works real nice :

Source : http://www.dillerdesign.com/experiment/DD_roundies/

Then you simply add the following:

<script type="text/javascript" src="DD_roundies.js"></script><script type="text/javascript">  DD_roundies.addRule('.roundify', '10px');</script>

Rounded Corners on Images in Drupal

Trying to apply rounded corners via CSS to images in all browsers is painful. Apparently several versions of Firefox (3.6 +) added to the pain when -moz-border-radius stopped working... until FF 4.0.

Then you have the dreaded IE browsers...ughh... CSS is not ready for a bullet-proof solution.

Solution: Why not pre-process the images on load-time? excellent... no need for an image editor to modify images manually.

If you are using Drupal... you are in luck:
Enter Drupal's Imagecache... except native imagecache doesn't handle rounded corners... so.. enter Imagecache Actions... an extension module to Imagecache.

In the D7 version, there is this problem where the rounded corner processing only works with PNG files. Excellent, Imagecache actions also offer the ability to convert the image to PNG.

so... a combination of actions like such...

Rounded
RT: http://drupalcode.org/project/imagecache_actions.git/blob_plain/HEAD:/docs/ro...

 

Using JQuery in Drupal 7

Looks like adding custom JQuery scripts in Drupal 7 just got harder.

The $ is no longer specific to JQuery as it allows flexibility to other javascript libraries.

Therefore, to get a JQuery script to be recognized in Drupal 7, you need to wrap the code in an anonymous function... like this...

(function($) {
   $().ready(function() {
         //...
    });
})(jQuery);