Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > SWFObject и широкая флешка как фоновая картинка

Автор: Ergo 21.6.2010, 12:40

Приветствую.

В шапке сайта требуется установить флеш, при этом сайт резиновый, а значит по ширине тянется. Флеш не должен тянуться, по-этому я сделал флешку шириной 2000 пикселей и по идее должен вставить ее как фон. То есть представьте себе, Вам поставлена задача вставить фоном большую картинку, которая при увеличении разрешения экрана будет просто отображаться полностью, а не растягиваться. То есть фоном ставится картинка 2000 на 2000 например, и если разрешение экрана 800х600, то картинка будет отображаться только на 800х600 пикселей, а если разрешение 1600 то соответственно на 1600, при этом в запасе на ширину будет еще 400 пиксей. НУ я думаю поняли о каком методе я говорю.

Теперь переходим к моей проблеме. Я решил провернуть такую же фишку с флешкой. Сделал ее 2000 на 120 и вставил с в слой (div) шапки помощью SWFObject:

Код


<script type="text/javascript">
var fl = new SWFObject("files/headcs3test2.swf", "movie", "2000", "120", "8");
fl.addParam("quality", "high");
fl.addParam("wmode", "transparent"); 
fl.write("layerfon");
</script>

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

Собственно вопрос, как реализовать задумку первого абзаца, для флешки и с помощью SWFObject

Спасибо!

Автор: нуп 21.6.2010, 13:03

Помойму надо делать через js. Узнаешь разрешение с помощью screen.width и вставишь ширину под определённое разрешение smile

Автор: Ergo 21.6.2010, 13:17

нуп

Флешку вообще нельзя масштабировать. То есть ее истинный размер по ширине 2000, если его изменять она начинает деформироваться.

Повторяю вопрос: Как вставить флешку шириной в 2000 к фон при этом, чтобы она НЕ растягивала слой и не создавала скролинг.

Автор: FightInGlory 21.6.2010, 14:12

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

Автор: Ergo 21.6.2010, 14:17

FightInGlory

Gif весит очень много.

Автор: FightInGlory 21.6.2010, 14:25

А можно посмотреть на скриншот флешки, или несколько скринов?
А ты не забыл, что гиф файл, можно сделать маленьким и репитом заполнить всю шапку?

Автор: ksnk 21.6.2010, 14:33

Ergo,
А что обрамить флешку в div с overflow:hidden и выставленой шириной получается?
если получается - поставить этот div абсолютным позиционированием в нужное место и сделать ему z-index поменьше. Еще нужно не забыть про параметр флешки <param name="wmode" value="transparent"> и в теге embed тоже...

Автор: Ergo 21.6.2010, 14:52

FightInGlory

Продолжительность флешки примерно 10 секунд. Плюс ко всему нету элементов которые можно зациклить.

ksnk

Код


#layerfon {
     display:block; width:2000px; height:120px; position:absolute; overflow:hidden; z-index:1;
}

layerfon - это айдишник слоя в который вставил флешку. Не помогает, скролинг не уходит.

Автор: ksnk 21.6.2010, 15:08

Цитата

width:2000px;

И куда должен в этом случае уходить скроллер?
width:auto или width:100% иначе нет смысла в overflow:hidden...

Автор: blah 21.6.2010, 15:09

Ergo,
Естественно скрол никуда не денется при width:2000px;. Используйте width:100%;. А position:absolute; ни к чему.

Добавлено через 1 минуту и 50 секунд
Только правый край флеша будет прятаться, для центрирования нужен js.

Автор: Ergo 21.6.2010, 15:22

ksnk

С 100% работает! Благодарю за помощь.
Если интересно скину ссылку на сайт когда его выгружу.