настроить CSS для расширения заголовка - PullRequest
2 голосов
/ 04 марта 2010

для этого сайта:

http://yoursdproperty.com/

Вы видите, как наверху есть лишние пробелы?

как бы мне расширить это изображение, чтобы избавиться от этого места?

Странная вещь в том, что флэш-файл, который запускает изображения заголовка, уже был изменен мной, чтобы быть шириной страницы. Что-то в CSS делает его старым размером 940 в ширину.

обратите внимание, что меня интересует только внесение изменений в CSS или HTML, а не в flash или javascript

Ответы [ 8 ]

3 голосов
/ 07 марта 2010

Вам нужно изменить ширину тега вставки в html

<embed height="250" width="1050" wmode="transparent" quality="high" name="topheader" id="topheader" src="/templates/pjo_joomlaforall/images/header.swf" type="application/x-shockwave-flash">

и затем удалите width:940 из div #at-flashheader

2 голосов
/ 08 марта 2010

Вопрос (это правильно?):

  1. Как сделать так, чтобы ролик Flash расширялся на всю ширину страницы (вместо 940 пикселей)?
  2. Как сделать так, чтобы ролик Flash находился вверху родительского элемента и, следовательно, в верхней части страницы?

Выше должно быть сделано без изменения Javascript или Flash.


Ответ:

Часть 1 :
Похоже, вы используете FlashObject для встраивания флэш-памяти.
FlashObject принимает несколько аргументов, 3-й и 4-й из которых представляют атрибуты ширины и высоты элемента.

Пока эти атрибуты установлены, они будут переопределять ЛЮБЫЕ другие классы CSS, которые вы применяете.
Чтобы изменить ширину на 100%, вы должны изменить это значение с 940 до 1040 или, возможно, на «100%».

 <script type="text/javascript">
    var fo = new FlashObject("/templates/pjo_joomlaforall/images/header.swf", "topheader", '100%', 250, 7);
    fo.addParam("wmode", "transparent");
    fo.write("flashcontent");
 </script>

Хотя это может считаться использованием Javascript, это единственное решение, которое может работать.

Часть 2 :
Фактический SWF, с которым вы имеете дело, имеет ширину 240 пикселей и высоту 200 пикселей.
Часть файла флэш-памяти 'image' имеет высоту всего 50 пикселей и находится в вертикальном центре swf.

Нет способа использовать CSS для увеличения этого 50px центра в SWF.
Что вы можете сделать, это использовать CSS, чтобы увеличить SWF так, чтобы высота центра соответствовала вашим потребностям, а затем еще немного CSS, чтобы обрезать верхний и нижний пробелы.

Поместите тег вставки внутри элемента, переполнение которого скрыто, и примените отрицательное верхнее поле (или отрицательную позицию) к вставке, равной пробелу, который вы хотите обрезать.

<style type="text/css"> 
#at-flashheader{ 
    overflow:hidden
}
#flashcontent{
    margin-top:-40px;
}
</style>
<div id="at-flashheader"><div id="flashcontent"></div></div>

'Конечно, это не сработает, если ширина swf будет в процентах, так как высота пробела не будет постоянной. Если вы установите ширину равной 1040 пикселей, вы можете соответственно установить отрицательное верхнее поле.


В сторону:

Вы действительно должны делать это с Mootools или JQuery вместо Flash.
Показательный пример - у меня в браузере есть Flashblock, и мне приходилось прыгать через обручи, чтобы увидеть, о чем вы говорите. Если бы я был на своем iPhone, прыжки через обручи не помогли бы.

1 голос
/ 07 марта 2010

Я бы сказал несколько пунктов:

  1. Сделать галерею исчезновения изображений JavaScript. Он менее ресурсоемкий и с большей вероятностью будет работать на всех платформах, а также будет проще в работе.

  2. Это может быть немного много, но если установить ширину сайта в 960px (см. Www.960.gs), он будет лучше вписываться в окна браузера пользователей с разрешением 1024x768 (по-прежнему обычное разрешение) без горизонтальных полос прокрутки .

1 голос
/ 07 марта 2010

Не ответ на ваш вопрос, но почему это во Flash в первую очередь? Насколько я могу видеть, единственный эффект, который это имеет, - то, что заголовок остается пустым, когда вы выключаете JavaScript.

1 голос
/ 04 марта 2010

Ваш флэш-фильм должен иметь размер 960 x 250, чтобы он был на всю ширину и длину этого пространства (это будет за картиной брокера, верно?).

Расположите его слева: 0; и верх: 0; и ты прям.

1 голос
/ 04 марта 2010

Добавить margin-top:-45px к классу at-flashheader

0 голосов
/ 08 марта 2010

Вы должны будете сделать то, что говорит Эмили, чтобы Flash заполнил область заголовка.

В вашем случае вы бы изменили ширину тега object / embed в вызове FlashObject:

var fo = new FlashObject("/templates/pjo_joomlaforall/images/header.swf", "topheader", "1050", "250", "7");

Но у вас все равно будет пробел вверху, потому что файл swf (точнее, изображения в файле swf) имеет встроенный, насколько я могу судить. Вам нужно отредактировать Flash, чтобы избавиться от пробела.

0 голосов
/ 07 марта 2010

сделать это с помощью ActionScript во флэш-памяти, используя переменные ширины и высоты сцены. если у вас нет источника вспышки, оберните swf в новый swf, чтобы новый swf масштабировал вложенный swf.

...