1

I'm experiencing a problem with pie.js in IE8. Here's my css code

.example{
  top:0;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  padding:0;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  font-weight:bold; 
  cursor:pointer;
  text-decoration:none;
  position:relative;
  z-index:1;
  background-position: 0 50%;
  background-repeat:repeat-x;
  text-align:center; 
  -pie-poll:true;  
  }

and I called it using jQuery

jQuery(document).ready(     
                    function() {
                        if (window.PIE) {
                         $('.example').each(function() {
                         PIE.attach(this);
                        });
                     }                  
                });

It works fine in IE7, but when I switch to IE8, the pie style doesn't render until I hover over the styled element. IT ONLY HAPPENS FOR THE FIRST TIME AFTER COMPLETELY LOAD THE PAGE!!LATER IT WORKS OKAY....

I'm pretty sure I use the absolute path for loading the pie.js and I have taken care of Z-index as well as position:relative...

Just don't know what is wrong......does any one have the same issue? How do you solve it?

HopeNotGetFat4ever
  • 11
  • 1
  • 2
  • I personally hate that library. Haha it's probably my fault, but it doesn't seem to work once you get into any type of complex structure, and especially with dynamic things. – Ian Apr 23 '13 at 19:47
  • I never call it with jQuery. I use conditional comments to detect IE 8 and under then, if so, link a separate style sheet (that is linked after linking your main style sheet, of course), and then I just use the CSS rule `behavior: url(PIE.htc)` of course, you would have to path to the file like normal, that is, it may not just be in the same directory as the page, in which case you would use something like `behavior: url(/directoryName/subDirectoryName/PIE.htc)` – VoidKing Apr 23 '13 at 19:51
  • @Ian You have to give them some credit, they have allowed me to achieve results for my clients that I simply could not have achieved any other way (i.e., render fully opaque elements inside semi-transparent ones, using rgba, for 32-bit clients that just can't seem to part with IE). The trick is to pick your spots and only use it when necessary. – VoidKing Apr 23 '13 at 19:54
  • @VoidKing You're absolutely right. What they've done is amazing. It just didn't work for me, and I wouldn't be surprised if I was just using it improperly or doing something wrong. I loved it when it worked, and I know it would've been great if I could get it to work consistently – Ian Apr 23 '13 at 19:57
  • @Ian Well, until I saw this post, I didn't even know you could throw it in jQuery/JavaScript. I've always just added the above stated behavior property? and it has always worked for me. – VoidKing Apr 23 '13 at 20:01
  • @VoidKing Same here, I always used the `behavior: url(PIE.htc);` too – Ian Apr 23 '13 at 20:02
  • 1
    @Ian Huh, wonder why it didn't work? Who knows... What I do know is that I don't like overusing PIE. I only use it in case I need a child element to be fully opaque inside a trans-parent parent (*giggle) or to round off edges when I have strict client requirements (I H8 IE 8) – VoidKing Apr 23 '13 at 20:04
  • @VoidKing I don't like to overuse it either, but I can't help it when it *can* do so much! And because of that, I get myself into trouble and just end up leaving it out. Just waiting for IE7/8 to be obselete... – Ian Apr 23 '13 at 20:09
  • @Ian You, me, and every other IT professional that ever existed (except the ones that worked on the IE 7/8 projects, I guess :)) – VoidKing Apr 23 '13 at 21:54

0 Answers0