JQuery Plugin Rounded corners
I'm trying to get borders to display properly with this plugin:
http://jquery.malsup.com/corner/
On the page it says to use the keep option, but it does not give an option to specify what colour the border should be , if I specify the type of border in a stylesheet: like (border:1px solid #d4d4d4;) it shows the border great in firefox, but in ie6 and 8 it shows the border but not to the contours of the rounded box (ie square)
Has anyone had any experiences with this and can offer a solution?
Code Below
Darren
http://jquery.malsup.com/corner/
On the page it says to use the keep option, but it does not give an option to specify what colour the border should be , if I specify the type of border in a stylesheet: like (border:1px solid #d4d4d4;) it shows the border great in firefox, but in ie6 and 8 it shows the border but not to the contours of the rounded box (ie square)
Has anyone had any experiences with this and can offer a solution?
Code Below
Darren
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://github.com/malsup/corner/raw/master/jquery.corner.js?v2.11"></script>
<style>
#headerticket{
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfdfd', endColorstr='#c8d0d6');
-ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfdfd', endColorstr='#c8d0d6');
background: -moz-linear-gradient(top,#fdfdfd,#c8d0d6);
background:-webkit-gradient(linear,left top,left bottom,from(#fdfdfd),to(#c8d0d6));
height:100px;
width:100px;
border:1px solid #d4d4d4;
}
</style>
<script type="text/javascript">
$(function(){
$('#headerticket').corner("keep");
});
</script>
</head>
<body>
<div id='headerticket'></div>
</body>
Asked:
Who is Participating?
I'm not sure of how this plugin works, but you should now that CSS3 properties for rounding object's corners (in wich standard jquery rounding is based) doesn't work on current IE versions because they're not implemented yet.
You can take a look at this msdn article where IE rounding corners is explained.
http://msdn.microsoft.com/en-us/library/bb250413%28VS.85%29.aspx
You can take a look at this msdn article where IE rounding corners is explained.
http://msdn.microsoft.com/en-us/library/bb250413%28VS.85%29.aspx
Question has a verified solution.
Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.
Have a better answer? Share it in a comment.
All Courses
From novice to tech pro — start learning today.
-
Course of the Month4 days, 14 hours left to enrollMonitoring and Operating a Private Cloud with System Center 2012 R2 273 lessons
The plugin works fine generally with rounding div's it just does not handle the borders very well, have know used curvycorners to tackle this problem.
Darren