我正在这个颜色控制面板上做实验,用户可以使用控制面板中的幻灯片来改变页面的外观和感觉。一个额外的复杂性是,滑入面板在父窗口中,而更改的页面在iframe中。我希望这些更改在控制面板中进行时生效。为此,我不想使用AJAX。为此,我设计了一个算法,它工作得很好。
除了IE8的一个问题之外,一切都运行得很好。当页面加载时,我在css中使用此样式定义作为默认样式。
(感谢路易斯·拉扎里斯- http://coding.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/)
background-image: -moz-linear-gradient(top, #81a8cb, #4477a1); /* Firefox 3.6 */
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0,#4477a1),color-stop(1, #81a8cb)); /* Safari & Chrome */
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1'); /* IE6 & IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1')"; /* IE8 */这就是我试图用jQuery在javascript中做的事情( hex1和hex2是包含两个十六进制值的渐变的两个变量):
jQuery('#iframeId').contents().find('.gradient').css(
{
backgroundImage: '-moz-linear-gradient(top,' + hex1 + ',' + hex2 + ')', /* Firefox 3.6 */
backgroundImage: '-webkit-gradient(linear,left bottom,left top,color-stop(0,' + hex1 + '),color-stop(1,' + hex2 + '))', /* Safari & Chrome */
filter: 'progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=' + hex1 + ', endColorstr=' + hex2 + ')', /* IE6 & IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='" + hex1 + "', endColorstr='" + hex2 + "')" /* IE8 */
});如果我排除了-ms-filter的最后一个条件,代码运行得很好(因为根据我读到的文档,没有提到jQuery.css是否支持这个过滤器)。我所看到的问题的一个解决方案是使用以下命令查看浏览器的名称和版本
navigator.userAgent如果是"Internet Explorer8.0“,我会应用单一的背景色。
现在我的问题是,有没有其他方法可以绕过这个问题,在IE8上也获得渐变?
发布于 2013-01-17 16:25:12
有一种用jQuery设置CSS的替代语法。使用下面的代码进行尝试
jQuery('#iframeId').contents().find('.gradient').css({
'background-image': '-moz-linear-gradient(top,' + hex1 + ',' + hex2 + ')', /* Firefox 3.6 */
'background-image': '-webkit-gradient(linear,left bottom,left top,color-stop(0,' + hex1 + '),color-stop(1,' + hex2 + '))', /* Safari & Chrome */
'filter': 'progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=' + hex1 + ', endColorstr=' + hex2 + ')', /* IE6 & IE7 */
'-ms-filter': "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='" + hex1 + "', endColorstr='" + hex2 + "')" /* IE8 */
});发布于 2013-01-17 16:26:32
你的javascript有问题。-ms-filter的对象键应该用双括号或单括号括起来,否则会导致语法错误。
https://stackoverflow.com/questions/14374784
复制相似问题