Jon*_*ner 6 css safari wordpress jquery responsive-design
使用响应式caroufredsel,就像Chrome和Firefox中的魅力一样,但在Safari中它突然产生800px的顶部和底部边缘,抛弃一切.
它是一个响应式网站,奇怪的是,当受到500px或更低宽度的屏幕的媒体查询的影响时,问题不会发生.
该网站是一个wordpress自定义构建,等待服务器上的域映射到所有准备好的时候.
实况页面:
http://109.203.120.0/~wirebird/wordpress/the-guitars/
Run Code Online (Sandbox Code Playgroud)
在静态的HTML版本工作正常,所以它是一个WordPress的问题,或者说,它没有使用真正的域可事实?
用于射击caroufredsel的jquery如下:
jQuery(document).ready(function() {
jQuery("#guitars-gallery").carouFredSel({
auto: false,
circular: false,
prev: '#prev',
next: '#next',
responsive : true,
height : 500,
scroll: 1,
items : { width : 370, height : 500, visible : { min : 1, max : 3 } } });
});
function doSomething() {
jQuery('#guitars-gallery').trigger('destroy', true);
jQuery('#guitars-gallery').css({'text-align': '','float': '','position': '','top': '','right': '','bottom': '','left': '','width': '90%','height': '','margin': '1% auto'});
jQuery("#guitars-gallery").carouFredSel({
auto: false,
circular: false,
prev: '#prev',
next: '#next',
responsive : true,
height : 500,
scroll: 1,
items : { width : 370, height : 500, visible : { min : 1, max : 3 } } });
};
var resizeTimer;
jQuery(window).resize(function() {
clearTimeout(resizeTimer);
resizeTimer = setTimeout(doSomething, 100);
});
Run Code Online (Sandbox Code Playgroud)
任何想法最受欢迎,它让我发疯!
更新:我现在通过使用jquery在调用轮播后更改样式来解决这个问题:
jQuery('.caroufredsel_wrapper').css({'margin-top': '0px', 'margin-bottom': '0px'});
Run Code Online (Sandbox Code Playgroud)
解决了这个问题,但我仍然没有明白为什么会这样:-)
| 归档时间: |
|
| 查看次数: |
1025 次 |
| 最近记录: |