- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我是 StackOverflow 的新手,所以希望大家多多包容。我是一名网页设计师,有一些 Jquery 经验,但我承认我不太擅长它。我主要使用插件,必要时可以对代码进行一些调整。
我目前正在开发一个使用液体布局的摄影网站。我在主页上加入了 Jquery 循环插件来帮助展示照片。我最初对这个插件有问题,因为它使用了大量的绝对定位。我最终能够在研究问题时找到的一些代码的帮助下解决这些问题(我丢失了找到代码的网站,所以如果有人认出它,我很乐意给予信任)。
现在页面工作正常,除了一个问题 - IE 不会生成淡入淡出过渡。它将显示第一张图像,清空整个屏幕,然后显示下一张图像。我花了几个小时研究这个问题,但还没有找到解决方案。我确实找到了一个论坛,其中有人建议为骑行元素添加固定的高度和宽度,但此修复对我不起作用。它确实使图像淡入,但它们消失并在淡入下一个图像之前再次创建空白屏幕。
淡入淡出效果在 Firefox 和 Chrome 中完美运行。我目前在网站上没有淡入淡出,但作为引用,这里是网址:http://www.jnicholasphoto.com
这是 JavaScript:
SetHeightToTallestChild('.slideshow');
$(function() {
$('.slideshow').cycle({
fx: 'scrollDown',
speed: 2000,
timeout:5000,
random: 1,
cleartypeNoBg:true
});
});
$(window).resize(function() {
SetHeightToTallestChild('.slideshow');
});
});
function SetHeightToTallestChild(i) {
var tallest = 0;
$(i).children().each(function(){
var h = $(this).height();
if(h > tallest)
tallest = h;
});
$(i).height(tallest);
}
HTML:
div class='photo floatr' id='photo'>
<div class='slideshow cycle-main-frame clearfix' >
<div class='cycle-main-frame-row'> <img src="images/collage1.png" alt='J Nicholas Photography' /></div>
<div class='cycle-main-frame-row'> <img src="images/collage2.png" alt='J Nicholas Photography' /></div>
<div class='cycle-main-frame-row'> <img src="images/three.png" alt='J Nicholas Photography' /></div>
<div class='cycle-main-frame-row'> <img src="images/collage3.png" alt='J Nicholas Photography' /></div>
<div class='cycle-main-frame-row'> <img src="images/collage4.png" alt='J Nicholas Photography' /></div>
</div>
CSS(与循环图像相关):
.photo {
padding: 15px 0px 15px 15px;
margin: 0px;
margin-top: 35px;
width: 65%;
}
.photo img {
width: 100%;
position: relative;
display: block;
border: 8px solid #2F2E29;
border-right: none;
}
.cycle-main-frame {
width: auto !important;
position: relative !important;
overflow: visible !important;
}
.cycle-main-frame-row {
width: auto !important;
position: relative !important;
height: 0 !important;
}
最佳答案
开启
$(function() {
$('.slideshow').cycle({
fx: 'scrollDown',
speed: 2000,
timeout:5000,
random: 1,
cleartypeNoBg:true
});
});
将 fx 部分更改为
fx: 'fade',
关于Jquery Cycle Fade 过渡在 IE 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6228840/
今天有小伙伴给我留言问到,try{...}catch(){...}是什么意思?它用来干什么? 简单的说 他们是用来捕获异常的 下面我们通过一个例子来详细讲解下
我正在努力提高网站的可访问性,但我不知道如何在页脚中标记社交媒体链接列表。这些链接指向我在 facecook、twitter 等上的帐户。我不想用 role="navigation" 标记这些链接,因
说现在是 6 点,我有一个 Timer 并在 10 点安排了一个 TimerTask。之后,System DateTime 被其他服务(例如 ntp)调整为 9 点钟。我仍然希望我的 TimerTas
就目前而言,这个问题不适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visit the
我就废话不多说了,大家还是直接看代码吧~ ? 1
Maven系列1 1.什么是Maven? Maven是一个项目管理工具,它包含了一个对象模型。一组标准集合,一个依赖管理系统。和用来运行定义在生命周期阶段中插件目标和逻辑。 核心功能 Mav
我是一名优秀的程序员,十分优秀!