Bug #17507

IE7: Strange behaviour with hover event of nested Tabs/IRRE-levels with relative positioned HTML elements

Added by Oliver Hader over 12 years ago. Updated over 11 years ago.

Status:
Closed
Priority:
Should have
Assignee:
Category:
-
Target version:
-
Start date:
2007-08-08
Due date:
% Done:

0%

TYPO3 Version:
4.1
PHP Version:
4.3
Tags:
Complexity:
Is Regression:
Sprint Focus:

Description

This issue is very strange. It happens only in Internet Explorer 7 (and also version 6) when there are some nested Tabs and IRRE-levels and the Drag'n'Drop sorting using script.aculo.us activated.

The minimal structure is:
[tab 1] -> [irre 1] -> [tab 2] -> [irre 2] -> [tab 3] -> [irre 3]

On moving the mouse over the second tab menu ("tab 3"), all IRRE-levels below disappear. It seems that the CSS style would have been set to "visibility: hidden".

See the attached screenshots to get an idea what I'm talking about.
1) 0006104_normal.png shows the normal situation
2) 0006104_strange_error.png show the situation when moving the mouse over the parent tab menu

IE7 Version: 7.0.5730.11
prototype Version: 1.5.0
script.aculo.us Version: 1.7.0

This problem doesn't exist when using Firefox 2!
(issue imported from #M6104)

0006104_normal.png View (20 KB) Administrator Admin, 2007-08-08 17:03

0006104_strange_error.png View (13.2 KB) Administrator Admin, 2007-08-08 17:04

0006104_v3.patch View (1.58 KB) Administrator Admin, 2007-09-03 10:35


Related issues

Related to TYPO3 Core - Bug #17982: Child records are shown floated and not as blocks in Safari Closed 2008-01-11
Related to TYPO3 Core - Bug #21480: Problem with clearing of floated elements in IE Closed 2009-11-06

History

#1 Updated by Oliver Hader over 12 years ago

I found out, that the prototype.js method "Element.makePositioned()" is responsible for that behavior. If I disable the calls from script.aculo.us to the mentioned method, everything is fine in IE7.
<b>see</b> the attached experimental patch 0006104_experimental.patch

Unfortunatelly I don't know why this function was integrated to Drag'n'Drop in script.aculo.us. The new beta release 1.7.1-beta3 doesn't have any changes and the problem would still exist.

#3 Updated by Oliver Hader over 12 years ago

I found out that this also occurs if script.aculo.us Sortable isn't used at all. It can be seen, when CSS hover effects or onmouseover/onmouseout events are used that change the CSS-class of an element AND when a (DIV-)element is defined with the style 'position: relative;'.

#4 Updated by Oliver Hader over 12 years ago

The attached file "0006104.patch" should change this behaviour for IE6/IE7. The div-elements that get set with "position:relative" by prototype's Element.makePositioned() are defined to be "display: inline-block".

#5 Updated by Oliver Hader over 12 years ago

Committed to SVN:
  • TYPO3_4-1 (rev. 2480)
  • Trunk (rev. 2481)

Also available in: Atom PDF