使用相同的前/下一个按钮的JQuery多个幻灯片。

I'm trying to figure out a frustrating issue.

我在试图找出一个令人沮丧的问题。

What I have now :

我现在所拥有的:

• One ul containing two li, each containing one 3x3 table.
• 一个ul包含两个li，每个包含一个3x3表格。
• A jQuery "slideshow" script to show one table at once.
• jQuery“slideshow”脚本一次显示一个表。
• Two div on each side of the table (used for the "slideshow", prevButton and nextButton).
• 表的两侧各有两个div(用于“slideshow”、prevButton和nextButton)。
• Clicking on a td "expands" a specific div covering the whole 3x3 table (prevButton and nextButton are still visible).
• 单击td“展开”一个特定的div，覆盖整个3x3表(prevButton和nextButton仍然可见)。
• Clicking on an expanded div closes it and the table is visible again.
• 单击一个展开的div关闭它，并且该表再次可见。
• When no div is expanded and the table is visible, the nextButton and prevButton are used to go to the next/previous table.
• 当没有扩展div且表可见时，将使用nextButton和prevButton切换到next/previous表。

http://jsfiddle.net/m1djrrj8/

http://jsfiddle.net/m1djrrj8/

What I'm trying to do :

我想做的是:

• When a div is expanded (by clicking on a td), the table is covered and the nextButton and prevButton should NOT be used to go to the next/previous table, but rather be used to show the next/previous expanded div.
• 当扩展一个div(通过单击td)时，表将被覆盖，不应该使用nextButton和prevButton来访问下一个/上一个表，而应该用于显示下一个/上一个扩展的div。

Rough structure of the fiddle

小提琴的粗糙结构

Understanding with the Fiddle

与小提琴

• There are two tables with 9 cells (1,2,3,4,5,6,7,8,9) and (A,B,C,D,E,F,G,H,I), swap from one to another by clicking on the yellow sidebars.
• 有两个表，有9个单元格(1、2、3、4、5、6、7、8、9)和(A、B、C、D、D、E、F、G、H、I)，通过点击黄色边栏从一个单元格切换到另一个单元格。
• Clicking on each cell opens a specific div :
  • (1,2,3,4,5,6,7,8,9) displays (sq1,sq2,sq3,sq4,sq5,sq6,sq7,sq8,sq9)
  • (1、2、3、4、5,6,7,8,9)显示(于sq1、sq2、sq3、sq4 sq5,sq6,sq7,sq8,sq9)
  • (A,B,C,D,E,F,G,H,I) displays (sqA,sqB,sqC,sqD,sqE,sqF,sqG,sqH,sqI).
  • (A,B,C,D,E,F,G,H,I)显示(sqA,sqB sqC,序列图,sqE,平方呎,sqG,sqH,sqI)。
• 单击每个单元格，打开一个特定的div:(1、2、3、4、5、6、7、8、9)显示(sq1、sq2、sq3、sq4、sq5、sq6、sq7、sq8、sq9) (a、B、C、D、E、F、G、H、
• when sq1~9 or sqA~I is displayed, I would like to use the yellow sidebars to slideshow sq1 through sq9 or sqA through sqI instead of switching tables.
• 当sq1~9或sqA~I显示时，我希望使用黄色的边栏来通过sqI，而不是切换表来通过sq1或sqA来slideshow sq1。

The JSFiddle is a bit long and I apologize for that, but I would be really grateful if someone could help me out with this one; I'm tearing my hair out!

JSFiddle有点长，我为此道歉，但是如果有人能帮我解决这个问题，我会非常感激的;我要把头发扯下来!

1 个解决方案

#1

".button" is programmed to swich between <li>'s. So when you click the prev button or the next button, the current <li> disappears and the other <li> appears.
To get the desired result, you have to change the logic:

”。按钮“被编程在

's之间滑动。所以当你点击prev按钮或next按钮时，当前的

的之间滑动。所以当你点击prev按钮或下一个按钮时,当前的

消失，另一个

消失,另一个

出现。为了得到想要的结果，你必须改变逻辑:

出现。为了得到想要的结果,你必须改变逻辑:

1. Check if a <div> covers the table.
   
2. 检查
   是否覆盖表。
3. If so, hide the <div> and show the next <div>.
4. 如果是，隐藏
   并显示下一个

   。