CSS3 PIE Forums - View topic - PIE JavaScript edition

Page 1 of 1

[ 8 posts ]

PIE JavaScript edition – Attach from CSS

Author	Message
CarlitoGil Joined: Sat Oct 13, 2012 9:26 pm Posts: 3	PIE JavaScript edition – Attach from CSS I'm in one of those situations where using the .htc method is not an option. After having a taste of it, there was no way I was going to walk the DOM to attach PIE. So this is my solution for attaching from the CSS: Code: .CORNERS { border-radius: 10px; -pie: expression(this._pieId \|\| window.PIE && window.PIE.attach(this)); }
Sat Oct 13, 2012 9:41 pm

jason Joined: Wed Jul 14, 2010 11:46 am Posts: 1396	Re: PIE JavaScript edition – Attach from CSS Very interesting! I'd want to double-check that the expression doesn't continue to execute after attachment (I believe the term is "single-run expression") but I can see this being very useful for folks. It doesn't handle element destruction like the 'behavior' property does, but it's probably good enough in most simple cases.
Mon Oct 15, 2012 1:28 pm

rulernature Joined: Tue Nov 29, 2011 1:26 am Posts: 38	Re: PIE JavaScript edition – Attach from CSS Hello guys, sorry for being dumb but how we must use this on css? I try to use in css under this example: .secondary,.primary { float: left; margin-right: 9px; font-family: Verdana, Arial, Helvetica, sans-serif; box-shadow: 0 0 2px 1px #ccc; padding: 3px 7px; font-weight: normal; font-size: 11px; color: #f5f5f5; cursor:pointer; border-radius:4px; position:relative; z-index:1; background: -moz-linear-gradient(center top , #FF9172 0%, #FF0000 100%); background: -webkit-linear-gradient(top, #FF9172 0%, #FF0000 100%); background: -o-linear-gradient(top, #FF9172 0%,#ff0000 100%); background: -ms-linear-gradient(top, #FF9172,#ff0000 100%); -pie-background: linear-gradient(top, #FF9172, #ff0000 100%); -pie: expression(this._pieId \|\| window.PIE && window.PIE.attach(this)); } I have main PIE.js in head and that document ready function for applying pie to my elements ...but unfortunately it is not working I must use a specific css in head only for pie? Thank's.
Thu Oct 18, 2012 12:41 am

CarlitoGil Joined: Sat Oct 13, 2012 9:26 pm Posts: 3	Re: PIE JavaScript edition – Attach from CSS rulernature wrote: I try to use in css under this example Code: <!DOCTYPE html> <html> <head> <title>PIE TEST</title> <script type="text/javascript" src="PIE.js"></script> <style type="text/css"> .secondary,.primary { float: left; margin-right: 9px; font-family: Verdana, Arial, Helvetica, sans-serif; box-shadow: 0 0 2px 1px #ccc; padding: 3px 7px; font-weight: normal; font-size: 11px; color: #f5f5f5; cursor:pointer; border-radius:4px; position:relative; z-index:1; background: -moz-linear-gradient(center top , #FF9172 0%, #FF0000 100%); background: -webkit-linear-gradient(top, #FF9172 0%, #FF0000 100%); background: -o-linear-gradient(top, #FF9172 0%,#ff0000 100%); background: -ms-linear-gradient(top, #FF9172,#ff0000 100%); -pie-background: linear-gradient(top, #FF9172, #ff0000 100%); -pie: expression(this._pieId \|\| window.PIE && window.PIE.attach(this)); } </style> </head> <body> <div class="primary"> works for me </div> </body> </html> This works on IE7. "expression" doesn't work on IE8+ unless quirksmode is triggered. To test this, save to .html, open in IE9, press F12 and change Document Mode
Thu Oct 18, 2012 2:53 am

rulernature Joined: Tue Nov 29, 2011 1:26 am Posts: 38	Re: PIE JavaScript edition – Attach from CSS Unfortunately I need something like this on Ie8+ Do you think I can use something similar with your example but to work in IE8? Thank's for your answer.
Fri Oct 19, 2012 2:34 am

xem Joined: Thu Apr 07, 2011 3:23 am Posts: 66	Re: PIE JavaScript edition – Attach from CSS jason wrote: It doesn't handle element destruction like the 'behavior' property does, but it's probably good enough in most simple cases. hey, couldn't a simple behavior:expression(...?...) take care of the destruction? CarlitoGil wrote: "expression" doesn't work on IE8+ unless quirksmode is triggered. instead of quirks mode, you could just force ie in ie7-mode with the appropriate mata (but that's dirty too)
Wed Dec 12, 2012 5:05 am

CarlitoGil Joined: Sat Oct 13, 2012 9:26 pm Posts: 3	Re: PIE JavaScript edition – Attach from CSS xem wrote: you could just force ie in ie7-mode with the appropriate mata (but that's dirty too) Try this in the HEAD tag Code: <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> Should work on IE8 and leave IE9 the same. As dirty goes, this isn't that much, I think.
Wed Dec 12, 2012 5:41 am

zatnas Joined: Wed Jan 09, 2013 1:16 am Posts: 1	Re: PIE JavaScript edition – Attach from CSS CarlitoGil wrote: xem wrote: you could just force ie in ie7-mode with the appropriate mata (but that's dirty too) Try this in the HEAD tag Code: <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> Should work on IE8 and leave IE9 the same. As dirty goes, this isn't that much, I think. That's like a good idea.. Any more ideas?
Wed Jan 09, 2013 1:17 am
Display posts from previous: Sort by

Page 1 of 1

[ 8 posts ]

PIE JavaScript edition – Attach from CSS

Who is online