HTML Tab Controls Containing Content Areas Bug

Jonathan Wood

Vote:

We're implementing a solution using a tab control. We're using Easy Responsive Tabs but the same is true for Foundation Tabs too.

Our tab control has four tabs, each tab contains a content area. When the active tab is changed and jquery executes the non-active tabs are essentially set to {{display: none;}}. When this happens the div containing "You can drop content here, or create a new block" is displayed in the very top left of the window and has the following inline styles applied.

<div class="epi-overlay-blockarea dojoDndSource dojoDndTarget epi-overlay-item epi-overlay-itemFocused dijitFocused dojoDndContainer" id="uniqName_109_2" widgetid="uniqName_109_2" style="left: 0px; top: 0px; width: 0px; height: 0px;">

Can anyone please advise on how to prevent this from happening as I'm sure we're not the first to come across this.

Cheers

Jonathan.

#87666

Jun 19, 2014 9:02

Jonas Söderström

Vote:

Hi,

Did you ever find a solution to this issue?

#113482

Nov 21, 2014 13:51

Jonathan Wood

Vote:

Hi Jonas

We did implement a javascript solution which basically hid the divs for the tabs that weren't the active tab using using the div's ID e.g. uniqName_109_2.

Then we updated our version of EPiServer to 7.10 and they changed their naming convention for these divs which broke our code.

Since then we've not tried to fix the issue again.

Cheers

Jonathan.

#113513

Nov 23, 2014 23:03

Jonas Söderström

Vote:

Thanks for reply. I actually got aware that there is a bug filed for this issue. (http://world.episerver.com/support/Bug-list-beta/bug/119725) Its in active state. Hopefully we will see a solution to this in the near future.

/Jonas

#113541

Nov 24, 2014 13:00