Адаптивный Canvas / Элементы / Сниппеты Bootstrap

Версия: v1.0.1

Каталог: Сниппеты Bootstrap

Категория: Элементы

Bootstrap: 3, 4

Для CMS: HTML, Drupal, Joomla, uCoz, WordPress, Magento, OpenCart, PrestaShop

Язык: Русский

Уникальный ID: 32

Количество символов:

Посмотрели: 4812 раз

Помощь: установка & настройка

Прокомментировали: 0 раз

Рейтинг: 5.0 / 5 - 4 голосов

Тип лицензии: CC BY 4.0

Авторство: http://u.to/kwNWDQ

Информация: Пользователям

Информация: Правообладателям

Теги: бутстрап, канвас, Responsive, Bootstrap, сниппет, Canvas, Snippet

Поделился: aTmpl

Добавлено: 2015-11-25 в 20:27

Метка: 1582179392

⇄ ⇅

canvas.width = 1024;
 canvas.height = 768;

var background = new Image();
 var width = 320;
 var height = 240;
 background.src = "http://drawings-girls.ucoz.net/2015/08/devushka-v-shleme-s-kluvom.jpg";

background.onload = function() {
 ctx.drawImage(background, 0, 0, canvas.width, canvas.height);
 }
 });

$(document).ready(function($) {
 var c = $('#canvas');
 var ct = c.get(0).getContext('2d');
 var container = $(c).parent();
 var background = new Image();
 var width = 320;
 var height = 240;
 background.src = "http://drawings-girls.ucoz.net/2015/08/devushka-v-shleme-s-kluvom.jpg";

$(window).resize(respondCanvas);

function respondCanvas() {
 c.attr('width', $(container).width());
 c.attr('height', $(container).height());
 ct.drawImage(background, 0, 0, $(container).width(), $(container).height());

console.log($(container).height());
 }

respondCanvas();

});
</script>

BootstrapTema

Адаптивный Canvas

Скриншот

Подробнее

Похожие материалы

Просмотренные материалы

Всего комментариев: 0