Anti-aliased Rounded corners with JQuery

307 Responses to “Anti-aliased Rounded corners with JQuery”

RSS feed for comments on this post.

1. Niels says:

   

   @Jakobud:
   I have no broken functionality in FF3…

   And in IE7 you will get the error, but only when you make the two top or the two bottom corners have radius 0 at the same time (so create rounded corners at the top and not at the bottom or visa-versa) AND set a border for your element.

   I happens because (topMaxRadius-borderWidth) or (botMaxRadius-borderWidth) evaluates to a negative value leading to a double minus sign in

   <strong>”-”</strong> + (botMaxRadius-borderWidth)

   Comment made on March 12, 2009 at 10:44 pm

2. VN Webdesigner says:

   

   I got some problems with this plugin:

   1. My client site current play with Jquery 1.3.1, so the problem is this plugin doesn’t run well on Jquery 1.3.x

   2. When I play this plugin, some css to be changed automatically, such as position move up, absolute position changed to relative position.

   Can this be resolved?

   Thanks!

   Comment made on March 13, 2009 at 5:00 am

3. Niels says:

   

   @VN Webdesigner:

   With regard to point 1 take a look at post 326 by Bruno. That should resolve your issues with jQuery 1.3.x.

   Comment made on March 13, 2009 at 10:31 am

4. Jakobud says:

   

   Anyone have any clue why I get the following pink background color show through when I add borders to my DIVs?

   http://img3.imageshack.us/my.php?image=roundedcornerpink.jpg

   Comment made on March 17, 2009 at 4:36 am

5. Rodrigo Barba says:

   

   I think found a bug:

   I’m in debian + FF3 + JQuery 1.3.2 + Curvy Corner 1.8.1 and when I use the $.corner() in a page with a form, the option ’save password’ of FF not work!

   Comment made on March 17, 2009 at 6:57 pm

6. Jordan says:

   

   The problem is not with the css zoom, its the jquery syntax.

   $($$ +” *”).css(“zoom”,”normal”);

   ^^ in that line the “$$” is already a jQuery object, so this should translate to something like $($(’someElement’) +” *”), which is a big no-no.

   Solution:
   $(“*”, $$).css(“zoom”,”normal”);

   OR

   $$.children(“*”).css(“zoom”,”normal”);

   Comment made on March 18, 2009 at 4:27 pm

7. Scrambler says:

   

   i’m using:
   jquery: 1.3.2
   JQuery Curvy Corners: 1.81
   with patch:
   $($$ +” *”).css(”zoom”,”normal”);
   to
   $(”*”, $$).css(”zoom”,”normal”);

   my html:

   my css:

   cont
   {
   background-color: #cc0000;
   padding: 20 0 20 20;
   width: 600px;
   border: solid 5px #000000;
   }

   and see this error

   http://s2.subirimagenes.com/otros/2185822corners.jpg

   have any solution for this problem?

   Comment made on March 18, 2009 at 10:23 pm

8. Zanch says:

   

   JQuery 1.3.2 + curvy corners 1.8 doesn’t work in internet explorer 6, 7, 8 … that’s all I tested it in. Firefox works fine.

   Comment made on March 18, 2009 at 11:45 pm

9. Scrambler says:

   

   Zanch, i have test with JQuery 1.2.4 and also fails :S

   Comment made on March 19, 2009 at 11:49 am

10. Scrambler says:

    

    Sorry,I insert this tags and WORK!!!!

    Comment made on March 19, 2009 at 12:54 pm

11. Chris says:

    

    I know that this is probably a stupid question, but I seem to be stupid when trying to use this plugin.

    When I implement this, a bottom-margin that was 10 turns into a margin the is about 60.

    Is there something I need to do to enforce margins/paddings?

    Thanks,
    Chris

    Comment made on March 19, 2009 at 9:34 pm

12. Mike Jolley says:

    

    Im now uploading a new beta based on Cuvey Corners 2 – stay tuned and Ill make a post when its up.

    Comment made on March 20, 2009 at 4:47 pm

13. Nick says:

    

    If anyone has a little time, I could use some help implementing CurvyCorners correctly. I’m using jQuery 1.2.6 and 1.8.1 of the plugin. Having no luck getting it to work in IE6. Works correctly in Safari and FF. One specific question: Do the element styles have to be inline for it to work properly?

    Thanks in advance to the generous soul who might be able to help.

    Comment made on March 23, 2009 at 2:03 pm

14. Jorge Mera says:

    

    check this http://blue-anvil.com/archives/jquery-curvy-corners-2-early-beta-available is compatible with explorer 8 and jQuery 1.3.2 , if used pandding attention must be greater than or equal to the size of the curve

    Comment made on March 31, 2009 at 1:29 pm

15. Dan says:

    

    hy i like the script but i`m having some problems using it.. exactly how do i set it up? i can`t figure that out

    Comment made on April 3, 2009 at 7:45 am

16. Sean says:

    

    @gremki

    Hey gremki… and all other readers,
    I tried to find:
    $($$ +" *").css("zoom","normal");
    and couldn’t, I then did a search for " *" in the jquery.curvycorners.packed.js (ver. 1.8.1) and found this:
    $(c+" *").css("zoom","normal")
    instead.

    I then just switch to this:
    $("*", c).css("zoom","normal")
    and it fixed the error I was getting in IE6 & 7.

    Tested in IE6 (Stand alone from Multiple IE) & IE7 with
    jquery-1.3.min.js

    Good luck

    Your friendly neighbourhood,
    Smccullough

    Comment made on April 13, 2009 at 8:34 pm

17. Smccullough says:

    

    UPDATE:
    Works with jquery-1.3.2.min.js…. both IE6 & 7

    Comment made on April 13, 2009 at 9:25 pm

18. Chetan Jethwa says:

    

    Hi, I am having a problem using curvycorners with jQuery 1.3.2 in IE 6/7/8, getting error uncaught exception

    Comment made on April 22, 2009 at 9:37 am

19. Chetan Jethwa says:

    

    Please ignore above comment, found answer on Smccullough’s blog, thanks

    Comment made on April 22, 2009 at 9:46 am

20. Benjamin says:

    

    Tried extracting, but had trouble doing so. Seems that the scripts or other content in the .zip file relating to __MACOSX.

    Bottom line… ‘jquery.curvycorners.min’ is the only one that unpacked.

    Any suggestions? Different .zip/extraction program?

    @_@

    Comment made on April 24, 2009 at 10:25 pm

21. Craig says:

    

    Thanks for the plugin!
    Saves me heaps of time on a regular basis!

    And thanks to Smccullough for the bug fix, no more uncaught exceptions for me!

    Comment made on April 27, 2009 at 1:43 am

22. Jan says:

    

    @Smccullough: This fixed when you have all corners rounded, but I still got it when i do this:

    $('#header').corner( {
tl: false,
tr: false,
bl: { radius: 8 },
br: { radius: 8 } });

    Even if i try radius 0 it doesn’t work

    Comment made on May 5, 2009 at 11:34 am

23. Smccullough says:

    

    @Jan

    I couldn’t seem to replica your issue you are having?
    I copied and pasted verbatim with no errors:

    $(document).ready(function()
{
/* Round corner */

    $('div.rounded').corner( {
    tl: false,
    tr: false,
    bl: { radius: 8 },
    br: { radius: 8 }
    });
    });

    What exactly is your setup?
    Browser: IE6/IE7 (/IE8, I haven’t test 8 yet)?
    jQuery version?
    In what order are you adding your script includes?

    You can post a response here or over at my blog (I’ll be able to response to you quicker if it’s on mine, simple because I’ll get an email notice)

    Hope I can help!

    Your friendly neighbourhood,
    Smccullough

    Comment made on May 6, 2009 at 2:26 pm

24. Tony says:

    

    These things aren’t working on IE8.

    Comment made on May 16, 2009 at 3:56 pm

25. Leanne says:

    

    Hi there, I was wondering if there’ll be an ie8 fix coming out soon? I am starting to reeeeally hate ie8.. :X

    Comment made on May 26, 2009 at 11:49 am

The comments are closed.