jQuery UI选项卡中的jQuery多个轮播无法在Internet Explorer和Chrome中正常工作

问题描述:

我的页面有问题,其网址可以在下面看到:

I have a problem in the page whose URL can be seen below:

http://hero.mynet.com/new/

页面中间的底部有一个选项卡式结构,每个选项卡都包含一个轮播作品,单击时每个轮播项目(图像)都可以叠加显示.

There is a tabbed structure at the middle bottom of page.Each tab consists one carousel working.And each carousel item (image) can be shown in an overlay when they are clicked.

我使用jQuery 1.3.2(我知道它已经很旧了,但是由于其他缺陷而无法更改),jQuery UI 1.7.3,jCarousel 0.2.8和FancyBox 1.3.4来构建它.

I used jQuery 1.3.2 (I know it's old but I cannot change because of other depencies), jQuery UI 1.7.3, jCarousel 0.2.8 and FancyBox 1.3.4 to build this.

单击第二个或第三个选项卡并单击上一个按钮时,Internet Explorer和Chrome的屏幕截图中会出现问题.

Problem can be seen in the screen shots of Internet Explorer and Chrome when 2nd or 3th tab clicked and prev button clicked.

是什么原因造成的,我尝试了很多方法来解决此问题,但是没有一个可以解决我的问题.

What can caused this, I tried many things to fix this but none of the fixed my problem.

您推荐什么?由于这项工作的时间安排,很难将所有结构更改为新结构.

What do you recommend? It's difficult to change all structure to a new one because of the time planing of this job.

现在就想所有答案

Internet Explorer屏幕截图

Chrome屏幕截图

此问题是因为创建了选项卡式界面后,您试图创建轮播.因此,jcarousel可能正在尝试在显示属性设置为null(非活动选项卡)的容器内渲染该轮播.由于无法可靠地确定此容器的位置和许多其他属性,因此在大多数浏览器中这将失败.请先渲染轮播,渲染轮播后,再创建标签页.

This problem is because you are trying to create the carousel after you have created the tabbed interface. So probably jcarousel is trying to render the carousel inside a container whose display property is set to null (a non-active tab) . Since position and many other properties of this container can not be reliably determined, this will fail in most browsers. Please try rendering the carousel before, once the carousel is rendered, then create the tabs.