Before I begin this post I'll add I have this working outside of jQuery, with something like the following:

// Wordpress header.php
<!-- CSS -->
<!--[if IE]>
<style type="text/css">
html.js body #page #header .branding a.toggleHide-Btn,
html.js body #nav-above .nav-previous a,
html.js body #nav-above .nav-next a,
body #page,
body #page #header .branding .image,
body #page .content #primary-wrapper #primary .hentry .entry-head .entry-title a,
body #page .content #primary-wrapper #primary .hentry .entry-head .entry-edit a.post-edit-link,
body #page .content #primary-wrapper #primary .comments ul#commentlist .comment.odd,
body #page .content #primary-wrapper #primary .comments ul#commentlist .comment .buttons .comment-edit a.comment-edit-link,
body #page .content #primary-wrapper #primary .comments ul#commentlist .comment .buttons .comment-reply a.comment-reply-link,
body #footer .nav-section,
body #footer ul#siteInfo-credits li.siteInfo-credits,
body.s-category-festivals #page .content #primary-wrapper #primary .comments ul#commentlist .comment .buttons .comment-edit a.comment-edit-link,
body.s-category-festivals #page .content #primary-wrapper #primary .comments ul#commentlist .comment .buttons .comment-reply a.comment-reply-link,
form input[type="text"],
form textarea,
form input[type="submit"]{behavior:url(<?php bloginfo('template_url') ?>/styles/PIE-1.0beta1/PIE.php);}
</style>
<![endif]-->

My problem occurred today when I tried to replace all of the above CSS and inject the behavour into elements that already have a border-radius CSS property instead. (For simplicity I've used the most basic of code below; using only the body selector. The full script included an if statement):

// Wordpress footer.php
<script type="text/javascript">
$(document).ready(function () {
// CSS3PIE
$('body').each(function () {
$(this).css('behavior', 'url(<?php bloginfo('template_url'); ?>/styles/PIE-1.0beta1/PIE.php)');
});
});
</script>

I also tried an absolute URL.

... both worked. I know this because in both cases the script crashed IE(8).

Is it possible to use CSS3PIE in combination with jQuery? Has anyone else tried this?

Thanks,

*Bump?*

It's certainly possible to apply the behavior via jQuery, as the css3pie.com homepage does exactly that for the demo. Try using the syntax:



That said, applying the behavior this way has performance implications, namely that you won't get any CSS3 styles applied until after jQuery and any other scripts have fully loaded and the documentready event has fired. This is one of the big advantages of using HTC-via-CSS rather than JS as the wrapper for PIE: it can be downloaded asynchronously and can be applied right away, often before any of the page has been rendered, so you don't get any flash of unstyled elements.