Справочник функций

Ваш аккаунт

Войти через: 
Забыли пароль?
Регистрация
Информацию о новых материалах можно получать и без регистрации:

Почтовая рассылка

Подписчиков: -1
Последний выпуск: 19.06.2015

Редактирование кода к резиновому интернет-баннеру

99K
14 августа 2017 года
tatiana_37
1 / / 14.08.2017
Здравствуйте. У меня вопрос по созданию кода к HTML-баннеру. А точнее, я не могу сделать его резиновым на сайте. Первый код растягивает баннер вертикально, хотя мне это не нужно, второй код не видит фона по бокам. Помогите пожалуйста. Первый код:
// код для баннера-растяжки (с учетом window.devicePixelRatio)
var _this = this;
var canvasWidth = canvas.width;
var canvasHeight = canvas.height;

window.addEventListener('resize', resize, false);
function resize() {
canvas.width = window.innerWidth * window.devicePixelRatio;
canvas.height = 'fixed';

canvas.style.width = window.innerWidth +"px";



_this.scale_text_mc.x = Math.round(window.innerWidth / 2);
_this.scale_back_mc.x = Math.round(window.innerWidth / 2);
}

resize();


Второй код:
var page_body = document.getElementsByTagName("body")[0];
page_body.style.backgroundColor = "#000000";
page_body.style.overflow = "hidden";
page_body.style.position = "fixed";

var page_canvas = document.getElementsByTagName("canvas")[0];
stageWidth = page_canvas.width;
stageHeight = page_canvas.height;

var viewport = document.querySelector('meta[name=viewport]');
var viewportContent = 'width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0';

if (viewport === null) {
var head = document.getElementsByTagName('head')[0];
viewport = document.createElement('meta');
viewport.setAttribute('name', 'viewport');
head.appendChild(viewport);
}

viewport.setAttribute('content', viewportContent);

function onResize() {
var widthToHeight = stageWidth / stageHeight;
var newWidth = window.innerWidth;
var newHeight = window.innerHeight;
var newWidthToHeight = newWidth / newHeight;
//
if (newWidthToHeight > widthToHeight) {
newWidth = newHeight * widthToHeight;
page_canvas.style.height = newHeight + "px";
page_canvas.style.width = newWidth + "px";
} else {
newHeight = newWidth / widthToHeight;
page_canvas.style.height = newHeight + "px";
page_canvas.style.width = newWidth + "px";
}
scale = newWidthToHeight / widthToHeight;
stage.width = newWidth;
stage.height = newHeight;
page_canvas.style.marginTop = ((window.innerHeight - newHeight) / 2) + "px";
page_canvas.style.marginLeft = ((window.innerWidth - newWidth) / 2) + "px";
}

window.onresize = function () {
onResize();
}

onResize();


весь контент у меня назван scale_text_mc Он должен быть по центру, а фон по бокам scale_back_mc.
Буду очень признательна за помощь
99K
07 сентября 2017 года
Дмитрий Лисов
1 / / 05.09.2017
Для всех вебмастеров интересующихся HTML хочу предложить редактор кода http://ciberfox.ru
70K
17 октября 2017 года
ИгнатЮк
10 / / 14.10.2016
http://zexler.ru/ - обратитесь к ним)
Реклама на сайте | Обмен ссылками | Ссылки | Экспорт (RSS) | Контакты
Добавить статью | Добавить исходник | Добавить хостинг-провайдера | Добавить сайт в каталог