Избегайте угона колеса прокрутки встроенным YouTube / Flash видео - PullRequest
Новая
       10

Избегайте угона колеса прокрутки встроенным YouTube / Flash видео

3 голосов
/ 27 октября 2011

Я делаю некоторые улучшения на веб-сайте, на котором размещено видео на YouTube.Я сам не добавил этот код, но он выглядит следующим образом: 

      <object width="380" height="307">
        <param name="movie" value="http://www.youtube.com/v/DooLJvsH_BY&amp;hl=en_US&amp;fs=1&amp;" />
        </param>
        <param name="allowFullScreen" value="true" />
        </param>
        <param name="allowscriptaccess" value="always" />

        </param>
        <embed src="http://www.youtube.com/v/DooLJvsH_BY&amp;hl=en_US&amp;fs=1&amp;" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="380" height="307"></embed>
      </object>

У меня небольшая проблема с этим встроенным объектом: при прокрутке страницы вверх или вниз с помощью колеса прокрутки мышиперестает работать, когда курсор мыши находится над видео.

Есть ли какие-либо настройки html / css / param, которые я могу изменить, чтобы избежать этого?

См. сам сайт для рабочего примера.

Редактировать: Я испытываю проблему как в Windows 7 64bit, так и в Ubuntu 11.10 64bit.

Ответы [ 2 ]

3 голосов
/ 27 октября 2011 
<param name="wmode" value="transparent" />

(и эквивалент в embed)

Это предположение. У меня есть личный опыт, хотя, если вы установите это в IE, это не позволит Flash захватывать кнопки со стрелками для прокрутки, что кажется связанным.

0 голосов
/ 31 марта 2015

Это единственная проблема, которую я мог найти по этому вопросу. Мне удалось это исправить с помощью взлома.

Я обернул встроенный контент в div и добавил наложение с z-index, вот так: 

<div class="flash-wrapper">
    <div class="overlay"></div>
    <object>
        My object code goes here
    </object>
</div>

Затем с помощью CSS 

.flash-wrapper {
    max-width: 100%; /*For responsiveness purposes*/
    overflow: hidden; /*To wrap around everything inside*/
    position: relative;
}
.flash-wrapper object {
    /*to fully fill the wrapper - optional*/
    width: 100%;
    max-width: 100%;
    height: auto;
}
.overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    /*The following only applies when the object is declared after the overlay. The overlay needs a higher z-index number*/
    z-index: 100;
}

Теперь я могу прокручивать и верх вспышки.

...