Облачный сервис для Joomla сайтов
Навигация: Главная Форум

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

Анимация фон
(1 чел.) (1) Гость
ВнизСтраница: 12
Сообщения темы: Анимация фон
#14661
Анимация фон 1 г., 12 мес. назад Репутация: 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
Анимация фон 1 г., 12 мес. назад Репутация: 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
Анимация фон 1 г., 11 мес. назад Репутация: 0
спасибо большое!!! сейчас уже отображается как надо! только вот вопросик не большой!
подскажите пожалуйста, как растянуть полностью на страницу анимацию? (высота). А то мышкой скролю вниз и там серая зона снизу получается!
Big
Постов: 5
graphgraph
Пользователь в оффлайне Кликните здесь, чтобы посмотреть профиль этого пользователя
Для добавления сообщений Вы должны зарегистрироваться или авторизоваться
 
#14669
Анимация фон 1 г., 11 мес. назад Репутация: 0
Big
Постов: 5
graphgraph
Пользователь в оффлайне Кликните здесь, чтобы посмотреть профиль этого пользователя
Для добавления сообщений Вы должны зарегистрироваться или авторизоваться
 
#14671
Анимация фон 1 г., 11 мес. назад Репутация: 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
Анимация фон 1 г., 11 мес. назад Репутация: 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
Модераторы: Fidelity, Nikolia, cvetercom, Xemreht, mr.Hi-End
получить последние сообщения прямо на Ваш рабочий стол
Баннер
Pool Snooker Billiards Graphite Cue Stick firm Radicura Enterprises varied line up of International Brands in allied fields. Proprietor Amit Jain being an expert in branding activities actively solicits global partnerships to commit worldwide trade sport equipment goods distributor dealer supplier importer exporter trader consultant franchise shop E-Commerce Website Designing, Development, Hosting, SEO & Online/Offline Advertising ~ Goods Warehousing, Preparation, Logistics & Worldwide Customs Clearances ~ Joint Venture Liaisons for Real Estate, Finance, Insurance, Distribution & Manufacturing