CSS3 PIE Forums
http://css3pie.com/forum/

Rounded Corners for images in JCarousel
http://css3pie.com/forum/viewtopic.php?f=3&t=1996
Page 1 of 1

Author:  chrisprog13 [ Tue Feb 26, 2013 3:52 am ]
Post subject:  Rounded Corners for images in JCarousel

Hello community,

I want images in a JCarousel to have rounded corners in IE 7 and IE 8.
I could successfully reach this for images that are not inside a JCarousel.

Here is the behavior:

I gave the images in the JCarousel the following CSS style rule:

Code:
.jcarousel-item a img{
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 0 3px #666666;
    behavior: url(/fileadmin/templates/pie/PIE.php);
    position: relative;
    z-index: 1;
    height: 135px; width: 135px;
}


(also I have
Code:
.jcarousel a {position:relative;z-index:1;}
)

I used Pie.php as I am in Typo3 and that is a PHP-environment (so you must use Pie.php instead of Pie.htc).

When I am analyzing such an img with in IE 10 integrated IE developer bar, switch Browser mode to IE 7
(document mode "Standard"), I don't see rounded corners. But when I uncheck any property in a CSS rule
displayed in the developer bar the rounded corners appear.

My question is:

Do you have any idea how I can reach the img in JCarousel to have rounded corners from the very beginning without clicking somewhere in the IE developer toolbar? ;-)

Thank you very much for your answer :)

Best regards,

chrisprog13

Author:  Tonttu [ Tue Feb 26, 2013 6:07 am ]
Post subject:  Re: Rounded Corners for images in JCarousel

Could you test on a Windows image as a virtual machine: http://www.modern.ie/en-us/virtualization-tools
Testing with browser modes is not accurate.

Author:  chrisprog13 [ Tue Feb 26, 2013 6:27 am ]
Post subject:  Re: Rounded Corners for images in JCarousel

Hello tonttu,

thank you for your hint. :) I then tried with IE Tester but the rounded corners did not occur either in the images of the JCarousel (the other images had a corner).

So maybe it has to do with those script errors the console messaged me:

Code:
SCRIPT5009: "jQuery" is undefined
galleria-1.2.6.min.js, line 10 character 1
SCRIPT5009: "jQuery" is undefined
jcrop-0.9.9.min.js, line 10 character 1


?

Or can it be that there is a conflict between the JCarousel.js and the js from Pie.htc?

Author:  Tonttu [ Wed Feb 27, 2013 2:07 am ]
Post subject:  Re: Rounded Corners for images in JCarousel

IE tester is not reliable either :) Please install Virtualbox for example and import an image downloaded from Microsoft from the link I gave you. It's very easy.

Author:  artuze [ Wed Feb 27, 2013 12:34 pm ]
Post subject:  Re: Rounded Corners for images in JCarousel

Tonttu wrote:
Could you test on a Windows image as a virtual machine: http://www.modern.ie/en-us/virtualization-tools
Testing with browser modes is not accurate.


Holy heck (as I only just joined and don't know if I could use the word I really want to use there :) ), that bit of information needs to be everywhere.... or at least on the Known Issues page, if possible. I literally spent the last full workday banging my head against my desk trying to figure out why I could not see the background image when it worked fine for solid colors. Circular borders, shadows, everything else was great. Tried all the fixes I could find both to make CSS3PIE work and to replace it, tried the beta, nothing was doing it because I was testing with browser modes in IE9. Finally, finally found this post, and with seven words you made me both relieved and infuriated. Hahaha

Checked it out in a VM I already had, and wouldn't you know it, it works swimmingly. :)

Author:  chrisprog13 [ Wed Feb 27, 2013 4:55 pm ]
Post subject:  Re: Rounded Corners for images in JCarousel

@artuze: Glad, that you got it to work now finally :):):) Thanks to Tonttu !! :):):)
@Tonttu: I will definitely implement the virtual machine but had to do this morning other issues.
And I found the solution:

I told that when I am unchecking any property in the IE developer toolbar it works.
So it then renders again the css.

So the only thing that I had to do was to add some jQuery ala

Code:
$('.myJcarousel a img).addClass('someClass');


in the initCallback-Function of the jCarousel-Plugin.

Then after emptying the cache it worked but guess what not in the modes of IE but in the IE Tester (sorry to Tonttu but this was the quickest way to check it,
also I checked it on browserStacks and there it worked also).

So when tomorrow it stills works (have some slight fear that it only works after emptying the cache - but that would not be logic)
we can close this topic! :)

Cheers
chrisprog13 :)

Author:  Tonttu [ Wed Feb 27, 2013 10:58 pm ]
Post subject:  Re: Rounded Corners for images in JCarousel

artuze wrote:
Tonttu wrote:
Could you test on a Windows image as a virtual machine: http://www.modern.ie/en-us/virtualization-tools
Testing with browser modes is not accurate.


Holy heck (as I only just joined and don't know if I could use the word I really want to use there :) ), that bit of information needs to be everywhere.... or at least on the Known Issues page, if possible. I literally spent the last full workday banging my head against my desk trying to figure out why I could not see the background image when it worked fine for solid colors. Circular borders, shadows, everything else was great. Tried all the fixes I could find both to make CSS3PIE work and to replace it, tried the beta, nothing was doing it because I was testing with browser modes in IE9. Finally, finally found this post, and with seven words you made me both relieved and infuriated. Hahaha

Checked it out in a VM I already had, and wouldn't you know it, it works swimmingly. :)


I'm happy for you! Also, take a peek at the sticky topics in "General Discussion" ;)

Author:  chrisprog13 [ Thu Feb 28, 2013 4:15 am ]
Post subject:  Re: Rounded Corners for images in JCarousel

Sorry I was happy to early:

The rounded Corners appear after calling the site a second time. From then on it works.
So now I still have to find a way to make the page appear the rounded corners from the very beginning.

I am just downloading a VM from modern.ie :)

Page 1 of 1 All times are UTC - 7 hours [ DST ]
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
http://www.phpbb.com/