Якорный тег на flash не работает в chrome

Question

следующий код работает на всем, кроме Chrome:

<a target="_blank" href="/FooodJournal">
        <object width="265" height="135">
            <param name="movie" value="2991BCTTor/xx.swf">
            <param name="allowFullScreen" value="true">
            <param name="allowscriptaccess" value="always">
            <param name="wmode" value="transparent">
            <param name="FlashVars" value="fileID=4928&context=12&embeded=true&environment=production">
            <embed width="265" wmode="transparent" height="135" src="2991BCTTor/xx.swf" flashvars="fileID=4928&context=12&embeded=true&environment=production" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true"></embed>
        </object>
    </a>

Flash используется для создания анимированной кнопки, и якорный тег делает это, так что вы можете нажать на нее, чтобы перейти на другую страницу. В большинстве браузеров вы можете щелкнуть в любом месте объекта Flash, и ссылка работает ... но в Chrome ссылка отображается в строке состояния, когда вы наводите курсор мыши на элемент flash, но ничего не делает, когда вы щелкаете по нему. Однако под флэш-элементом есть небольшая область (около 19 пикселей), где работает ссылка.

Как сделать так, чтобы в Chrome он вел себя так же, как и в других браузерах?

Answer 1

Попробуйте добавить pointer-events:none; к тегу flash OBJECT в качестве встроенного стиля:

<a target="_blank" href="/FooodJournal">
        <object width="265" height="135" style="pointer-events:none;">
            <param name="movie" value="2991BCTTor/xx.swf">
            <param name="allowFullScreen" value="true">
            <param name="allowscriptaccess" value="always">
            <param name="wmode" value="transparent">
            <param name="FlashVars" value="fileID=4928&context=12&embeded=true&environment=production">
            <embed width="265" wmode="transparent" height="135" src="2991BCTTor/xx.swf" flashvars="fileID=4928&context=12&embeded=true&environment=production" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true"></embed>
        </object>
    </a>

Это устранило проблему для меня в Chrome и не повлияло на другие браузеры.

Answer 2

Попробуйте добавить a { pointer-events: none; } к вашему CSS. Конечно, вы должны настроить селектор так, чтобы он соответствовал только этой конкретной привязке.

Подробнее о pointer-events см. http://dev.w3.org/csswg/css3-ui/#pointer-events и https://developer.mozilla.org/en/css/pointer-events.