Начална » Уеб дизайн » Представяне на уебсайта на HTML5 48 Потенциални демонстрации на Flash-Killing

    Представяне на уебсайта на HTML5 48 Потенциални демонстрации на Flash-Killing

    Така че сте чули всички слухове за HTML5, които ще поемат Adobe Flash. Докато повечето уеб потребители твърдят, че това е възможно или не, трябва да се скитате какво прави HTML5 толкова мощен, че дори гигантската компания Apple иска да я използва, за да замени Flash.

    Ето защо тази публикация съществува, няма да говорим за това, което HTML5 може да направи, а да покажем демонстрации на живо от магически неща, които HTML5 може да постигне с друг език като JavaScript, така че се пригответе да бъдете вдъхновени.

    Забележка: Тъй като HTML5 не се поддържа изцяло от определен уеб браузър, като Internet Explorer, силно ви препоръчваме да използвате браузъра Firefox, за да видите всички HTML5 демонстрации по-долу.

    Анимация

    Елементът от платното на HTML5 е решаващ фактор за HTML5, за да замени някои Flash анимации. Тя ви позволява да изграждате динамично, скриптово рендиране на 2D форми и растерни изображения с Javascript, което по друг начин е, контролируема анимация.

    Анимация на Audioburst

    Удобна и фантастична анимация, създадена с HTML5 платно и аудио маркер.

    Ball Pool

    Представена в последното Google I / O събитие, тази демонстрация показва колко динамична може да бъде HTML5.

    Blob Sallad

    Създадено от HTML5 създание, което ще ви хареса.

    Bomomo

    С Bomomo можете да наблюдавате различни атомни движения, симулирани с HTML5.

    Топка за браузър

    Учудвайте се с тази топка "HTML5" с кръстосан браузър.

    Bubbles

    Забавлявайте се, създавайки безкрайни плаващи мехурчета с различен цвят.

    Платно анимация на карикатура

    Прост и забавен HTML5 карикатура, която ви помага да разберете какво може да направи елементът на платното на HTML5.

    Coolclock

    Приятен аналогов часовник с възможност за персонализиране, създаден от HTML5 и JavaScript.

    Flickr PS3 Слайдшоу

    Преглеждайте снимките на Flickr със слайдшоу в стил PS3 в уеб браузъра.

    Интерактивен Polaroid

    Интерактивна демонстрация, която работи доста подобно на мултитъч интерфейс.

    JS Fireworks

    Насладете се на момента на фойерверките с предпочитаната от вас гравитация и скорост, задвижвани от HTML5 и Javascript.

    калейдоскоп

    Много красив и футуристичен HTML5 калейдоскоп.

    Течни частици

    Чувствителна анимация на частиците, която реагира въз основа на движението на мишката.

    Mesmerizer

    Друга чувствителна и изключителна HTML5 демонстрация, която показва как елементите наоколо реагират с вас.

    Облак от мъглявина

    Загуби се с тази невероятна мъглявина HTML5.

    Паралакс

    Вижте всички 2D форми в паралелна перспектива.

    Анимация на частици

    Елегантна HTML5 анимация на частици, която може да се формира в предпочитаното от вас съобщение.

    Разпространение

    Загуби се с тази безкрайна анимация.

    звездното поле

    Много готина анимация със звезди в HTML5, която би променила посоката и скоростта на базата на движението на мишката.

    Унищожаване на видеоклипа

    Едно кликване за възпроизвеждане на видео.

    Форма на вълната

    Наблюдавайте как хоризонталната вълна на HTML5 се движи, като променя амплитудата, дължината на вълната, ширината и т.н..

    3D ефект

    Впечатлен от анимацията на платно? Това е по-скоро елементът от платното на HTML5, който може да се използва и се нарича 3D ефект. Разработчикът може да разчита на елемент от платното, DOM и JavaScript, за да създаде 3D ефект, който по-късно може да се превърне в 3D анимация или игра.

    Canvas3D и Flickr

    Имате изцяло ново 3D изживяване с фотопоток на Flickr.

    Симулация на кърпа

    Реалистична симулация на платформи на базата на HTML5.

    Развиващо се чудовище

    Наблюдавайте чудовище, което се превръща в сложно създание, един от неговите създатели е HTML5.

    Google Giftbox

    Гигантската търсачка Google е представена в 3D, възпроизвеждащ се изглед.

    JS Touch

    Висококачествена и реалистична витрина "3D на 2D платно".

    Представяне на данни

    Докато елементът за платно на HTML5 може да се използва за създаване на анимация и 3D ефект, той може да се приложи и за представяне на математически данни.

    Gnuplot

    Gnuplot, приложение за нанасяне на данни в HTML5 версия.

    RGraph

    RGraph осигурява широк спектър от представяне на данни като бар диаграма, лента за напредък и традиционна радарна карта.

    Уеб приложение

    В крайна сметка, използвайки всички възможности, комбинирани от HTML5 и друг език, човек може да създаде интерактивно приложение или игра, която е близка до приложението Flash..

    CanvasPaint

    Свидетел, братът на Microsoft Paint влиза във вашия уеб браузър, а баща му е HTML5.

    CanvasMol

    Научно приложение, което е създадено, за да ви помогне да разберете структурата на някои елементи на земята.

    Музикален строител

    Начертайте интересен карикатурен образ с този минимален и интерактивен създател на карикатура.

    Плъзнете всичко тук

    Плъзнете всичко, което можете да плъзнете в демонстрацията, за да покажете подробности.

    Скица на Гарти

    Оригинално HTML5 приложение, което ви позволява да направите някои основни чертежи, които могат да бъдат запазени в различен формат като jpeg или png.

    PhysicSketch

    Начертайте каквото искате и вижте как те реагират със симулирана гравитация.

    Sketchpad

    Мощно HTML5 приложение за рисуване, което ви позволява да рисувате и редактирате изображението си по точен начин.

    Общи приказки

    Уеб приложение, което потвърждава географското разположение на съобщението, свързано с времето, придобито от Twitter, като по този начин ги оформя в карта за социално време, базирана на платно, доста тривиална (както е посочено от автора), но интересна.

    Игра

    3Bored

    Никога няма да ви омръзне, ако можете да продължите да избягвате стотици HTML5 куршуми в следващата секунда.

    Breakout

    Отскочете топката, за да счупите всички тухли.

    Canvascape

    Не е съвсем игра, но демонстрира как HTML5 може да се използва за разработване на браузърна игра с първа стрелба.

    Хвани го

    Колко топки можете да избягвате, за да получите своя печеливш HTML5 квадрат?

    Верижна реакция

    Верижната експлозия, за да се постигне целта, не се пристрастява.

    Cubeout

    Играйте Tetris в 3D, отгоре-надолу изглед.

    etchaPhysics

    Draw точка, за да преместите топката към звездата, не забравяйте за тежестта.

    Пъзел

    Кликнете, завъртете и пуснете парчета от пъзел, за да решите този HTML5-базиран пъзел.

    Пъзел със слайд

    Плъзнете до победата, друга HTML5 игра, която е създадена, за да изтръгне сок от ума.

    Същата игра

    Премахнете определена група, за да получите друга група в същия цвят и в крайна сметка ще получите победа.

    тетрис

    Една от най-класическите игри, върнати в живота на HTML5.

    цветно легло

    Още една игра Tetris в псевдо-3D версия.

    заключение

    Какво е ограничението на HTML5? На този етап не можем да решим, но с впечатляващото видео по-долу можем да разберем докъде е стигнал HTML5:

    Да, това е Quake II в уеб браузъра, така че сега е много ясно, че с HTML5 ще се роди по-новаторско уеб приложение, което да обслужва милиарди интернет потребители. Той е бърз, развива се и променя световната мрежа. Въпросът е как бихте използвали този HTML5, който променя играта?

    Ние обичаме да чуваме вашата идея!