Навигация: Главная Форум

Добро пожаловать, Гость
Пожалуйста Вход или Регистрация.    Забыли пароль?
Joomla Master форум
Joomla
Шаблоны Joomla!

Анимация фон
(1 чел.) (1) Гость
ВнизСтраница: 12
Сообщения темы: Анимация фон
#14661
Анимация фон 10 г., 2 мес. назад Репутация: 0
Привет народ, подскажите пожалуйста по проблеме.

Я хочу вставить анимированный фон на joomlu, который на jquery, но что то не очень получаетца пока.

Там надо вставить :
[code]<div id="demo" style="width: 100%; height: 100%;">
<canvas>Your browser does not support HTML5 canvas.</canvas>
</div>[/code[

я вставляю в шапку сайта, но у меня бэкграунд не вставляетца а получаетца большое пространство наверху самого сайта.

Подскажите пожалуйста, как сделать чтобы бекграунд был.
Big
Постов: 5
graphgraph
Пользователь в оффлайне Кликните здесь, чтобы посмотреть профиль этого пользователя
Для добавления сообщений Вы должны зарегистрироваться или авторизоваться
 
#14664
Анимация фон 10 г., 2 мес. назад Репутация: 58
Код:
<div id="demo" style="width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; right: 0; top: 0;">
<canvas>Your browser does not support HTML5 canvas.</canvas>
</div>  
Xemreht
Модератор
Постов: 647
graphgraph
Пользователь в оффлайне Кликните здесь, чтобы посмотреть профиль этого пользователя
Последнее редактирование: 27.02.2016 23:15 Редактировал Xemreht.
Требуется копирайтер для постоянного сотрудничества. Предложения и цены пишите в личку
Для добавления сообщений Вы должны зарегистрироваться или авторизоваться
 
#14668
Анимация фон 10 г., 2 мес. назад Репутация: 0
спасибо большое!!! сейчас уже отображается как надо! только вот вопросик не большой!
подскажите пожалуйста, как растянуть полностью на страницу анимацию? (высота). А то мышкой скролю вниз и там серая зона снизу получается!
Big
Постов: 5
graphgraph
Пользователь в оффлайне Кликните здесь, чтобы посмотреть профиль этого пользователя
Для добавления сообщений Вы должны зарегистрироваться или авторизоваться
 
#14669
Анимация фон 10 г., 2 мес. назад Репутация: 0
Big
Постов: 5
graphgraph
Пользователь в оффлайне Кликните здесь, чтобы посмотреть профиль этого пользователя
Для добавления сообщений Вы должны зарегистрироваться или авторизоваться
 
#14671
Анимация фон 10 г., 2 мес. назад Репутация: 58
Big писал(а):
спасибо большое!!! сейчас уже отображается как надо! только вот вопросик не большой!
подскажите пожалуйста, как растянуть полностью на страницу анимацию? (высота). А то мышкой скролю вниз и там серая зона снизу получается!
Чтоб вам давали нормальные развернутые примеры, нужно всегда прикреплять ссылку на страницу. Где смотреть?
Вам не джумла нужна, а учебник по html и css и немного js
Вот так хотите сделать? css-tricks.com/examples/FullPageBackgroundImage/progressive.php
Вот Perfect Full Page Background Image хороший материал. Читать не надо, просто внимательно см и копируйте код.
css-tricks.com/perfect-full-page-background-image/

Код:

<div id="demo" style="width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; right: 0; top: 0; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;  
background-size: cover;">
<canvas>Your browser does not support HTML5 canvas.</canvas>
</div>  


Вроде так
P.S. В моем примере убрана фиксация бэкграунд.
Xemreht
Модератор
Постов: 647
graphgraph
Пользователь в оффлайне Кликните здесь, чтобы посмотреть профиль этого пользователя
Последнее редактирование: 28.02.2016 21:05 Редактировал Xemreht.
Требуется копирайтер для постоянного сотрудничества. Предложения и цены пишите в личку
Для добавления сообщений Вы должны зарегистрироваться или авторизоваться
 
#14672
Анимация фон 10 г., 2 мес. назад Репутация: 0
Спасибо!!

-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover; - не оч помогло.

Перепробывал всё! и так и сяк, пока случайно не заметил кое что! Как вы сказали, сделал -
"width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; right: 0; top: 0; ">

поменял на position: fixed; и вообще крутяк всё растянулось как надо! Что и требовалось! Спасибо ещё раз!

А почему absolute не подощёл?
Big
Постов: 5
graphgraph
Пользователь в оффлайне Кликните здесь, чтобы посмотреть профиль этого пользователя
Для добавления сообщений Вы должны зарегистрироваться или авторизоваться
 
ВверхСтраница: 12
Joomla Master форум
Joomla
Шаблоны Joomla!
Модераторы: Fidelity, Nikolia, cvetercom, Xemreht, mr.Hi-End
получить последние сообщения прямо на Ваш рабочий стол
Баннер