Как скрыть определенную часть объекта Flash с помощью CSS? - PullRequest
0 голосов
/ 19 ноября 2010

Я встраиваю музыкальный проигрыватель flash от Soundclick в мой музыкальный сайт.У меня есть фиксированное место, где игрок должен быть размещен.Проблема в том, что игроки на сайте слишком велики.Нижняя часть флеш-плеера - это все, что мне нужно показать.Есть ли способ скрыть это с помощью переполнения: скрытый;метод?

Что я пробовал до сих пор:

Я поместил код встраивания в контейнер div и использовал «overflow: hidden;»метод, затем установите фиксированную ширину и высоту.Работает частично, но отображает только верхнюю половину.Что бесполезно, потому что в нижней половине находится список воспроизведения и кнопки.

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://counters.gigya.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEyOTAwNzA2MzY3MzkmcHQ9MTI5MDA3MTMwNTU4NyZwPTE1ODM2MSZkPSZnPTEmbz*5ZWIxNmMyMWQ5NmQ*YWJlODYy/YzdlMmM4NmM4NzMwNCZvZj*w.gif" /><div style="width:300px; height:450px; overflow:hidden;"><center><div><embed src="http://www.soundclick.com/widgets/creatives/mp3PlayerPremium.swf" width="300" height="430" flashvars="bandid=650303&ext=1" name="MP3PlayerPremium" type="application/x-shockwave-flash" wmode="transparent" pluginspage="http://www.macromedia.com/go/getflashplayer" /></div><div style="width: 300px; position: relative; top: -390px;"><a href="http://www.soundclick.com/bands/default.cfm?bandID=650303"><img src="http://www.soundclick.com/images/navigation/blank1x1.gif" border="0" width="300" height="250"></a> </div></center></div>

Ответы [ 3 ]

2 голосов
/ 19 ноября 2010

Я использовал технику, которую вы описали много раз, и всегда чувствовал себя немного виноватым.

Но я постоянно нахожу, что самый простой и надежный способ - обернуть мои вставки (порожденные js, iframeнезависимо от того, что виджет может использовать) в div, который я затем ограничиваю шириной и высотой.Наконец, используя отрицательные поля, чтобы вытащить объект из поля зрения.

#container {
   width:475px;
   height:65px;
   overflow:none;
}
#container embed {
   margin-top:-85px;
   margin-left:-145px;
}

Я считаю, что это самый простой способ найти мелодию, где находится мой объект, и это удобно, так как иногда виджеты имеют плавную ширину (100%).и вытягивание сторон с использованием отрицательного поля влево и вправо работает довольно хорошо, и вам не нужно беспокоиться о позиционировании, которое может быть сложным для некоторых разработчиков интерфейса.

(я делаю это для лайкбокса на Facebook постоянно - какВы можете увидеть в правом верхнем углу earmilk.com)

2 голосов
/ 19 ноября 2010

Возможно, попробуйте:

#flash_object_container {
  position:relative;
}
#flash_object {
  position:absolute;
  bottom:0;
}

. Это позволит визуализировать флэш-объект снизу вверх внутри вашего контейнера в сочетании с вашим переполнением, и явные значения высоты должны исправить это.

Редактировать (как вы указали код):

  <div style="width:300px; height:450px; overflow:hidden;">

можно изменить на:

  <div style="width:300px; height:450px; overflow:hidden; **position:relative;**">

, а затем:

<div> <embed src="http://www.soundclick.com/widgets/creatives/mp3PlayerPremium.swf" width="300" height="430" flashvars="bandid=650303&ext=1" name="MP3PlayerPremium" type="application/x-shockwave-flash" wmode="transparent" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </div>

становится:

<div **style="position:absolute; top:-YOUR_PX_VALUE;"**> <embed src="http://www.soundclick.com/widgets/creatives/mp3PlayerPremium.swf" width="300" height="430" flashvars="bandid=650303&ext=1" name="MP3PlayerPremium" type="application/x-shockwave-flash" wmode="transparent" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </div>
0 голосов
/ 19 ноября 2010

С помощью метода, который вы попробовали, попробуйте позиционировать объект flash с отрицательным верхним числом. (top="-50px;" или что вам нужно.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...