web

Rounded Corners and More! CSS3 PIE Makes Developing for IE Suck Less.

OK, so we all know how much IE sucks. Well I just stumbled across a neat little trick that makes IE suck less. It's called Progressive Internet Explorer (PIE). It's a simple and very effective way to use some advanced CSS features and have them actually work inside of Internet Explorer. PIE supports the following CSS3 features in IE 6-8:

  • border-radius
  • box-shadow
  • border-image
  • multiple background images
  • linear-gradient as background image

Instead of using Javascript and/or images, it uses a 28K .htc file which is loaded simply by uploading the PIE.htc file into your CSS folder and adding the following to your CSS on elements using any of the advanced CSS features

I had been searching for an easy way to do rounded corners in internet explorer for a while before I discovered sweet, glorious PIE. There are many methods involving images and Javascript, and even a few other .htc file implementations, that create rounded corners, but in my opinion they are all junk compared to PIE. PIE has the added benefit that the PIE.htc file is only loaded in IE and only when called from the stylesheet; it doesn't increase the overhead on any of the good browsers!

PIE is an open source project available on github. So if you have the skills, please contribute and let's get all CSS3 behavior rolled into this thing.

Tags: 

Yoxview Lightbox Image Viewer Module for Drupal 7

Yoxview

Yoxview is a wicked rad jQuery lightbox-style image viewer. I recently stumbled across this plugin while looking for a lightbox module for Drupal 7, only to discover that there was no D7 support yet. So I searched on some terms until I found the Yoxview Image Viewer plugin. Unfortunately, the Drupal module is broken. Searching through the issue queue you can find that there is a simple patch that fixes the module for the latest D7 releases. The module is super simple and simply adds yoxview to the displays that you can apply to content fields. There is no configuration options inside of Drupal itself, but all the options for yoxview are easy to configure via javascript.

I added these configuration options directly to the yoxview.js file included in the module. I'm sure there is a better way, but I figured since I had patched the module, I was already altering the module anyway. My yoxview.js file for this site looks like this

Yoxview also contains a ton of gallery options and can even play videos and slideshows. I haven't used many of these options yet. I just love the animation and the functionality of the image viewer.

Have you used Yoxview? What about other lightbox style plug-ins? Do you have an alternative that is currently supported on Drupal 7?

JaiPlace.com v 2.0 Launched!

jaiplace.com logo

We have just launched a new version JaiPlace.com! This is a website project I picked up somewhat randomly 2 months ago. I was working down at The Factory, when I met someone involved with Momentum MI. One of the Momentum MI companies was having trouble getting their site to display images properly. I mentioned that I work a lot with Drupal, and took a look at their site and had them fixed up in 5 minutes. The site was in rough shape when I found it. It had been worked on by a developer who did not have much Drupal experience. I impressed them so much that they switched to me as their developer.

This new version is significantly better than the old version that was launched, however, it is not where it needs to be. My goal with the first iteration was simply to get the navigation improved and increase the overall usability - since the site was basically unusable before. The ultimate goal of the site is to be a community site for people interested in Lifestyles of Health and Sustainability (LOHAS), and allow vendors to sell their own LOHAS products via an Etsy-like marketplace.

JaiPlace is still quite rough, but there is plenty to come, and I will probably be announcing major feature releases on this site.

Tags: 
Subscribe to RSS - web