Цитата:
Вопрос скорее об идеи заменить стандартные теги своими собственными, при этом ваши теги будут обладают логикой как сейчас jQuery плагины. список технологий растёт шустро от гугла angular, native/polimer, dart webcomponents от мозиллы x-tag, Цитата:
В принципе при поддержки Polimer веб компоненты по стандарту W3C уже могут работать на Chrome Android, Chrome, Canary, Firefox, IE 10+, Safari 6+, Mobile Safari с учётом миграции оперы на webkit думаю и там всё будет ок. |
Мой пост не об ангуляре конкретно, а о том что происходит с веб разработкой вообще.
Цитата:
|
Цитата:
Цитата:
 |
Цитата:
Цитата:
|
Цитата:
Цитата:
Цитата:
<элемент пошли_все_нафиг_я_самостоятельный="1"> </элемент> :) |
выглядит многообещающе
<element name="my-megabutton" extends="button" constructor="MegaButton">
<template>
<button><content></content></button>
</template>
<script>
MegaButton.prototype = {
megaClick: function(e) {
play('moo.mp3');
}
};
</script>
</element>
http://html5-demos.appspot.com/stati.../index.html#63 http://html5-demos.appspot.com/stati.../index.html#66 |
Угу мне тож нравится, я через pollyfill баловался, фурычит на всех современных браузерах.
Кстатии еще давным давно на IE 5 Можно было сделать вот такую штуку Почти что тоже компонент :)
<html xmlns:b="http://xyz.ru/">
<style type="text/css">
b\:spacer{
display: inline-block;
width: expression(this.width+'px');
height: expression(this.height+'px');
}
</style>
Привет <b:spacer width="200" height="1"></b:spacer>Всем
</html>
|
Цитата:
|
Цитата:
Лишний раз пропиарю своеобразные веб компоненты на jQuery, которые работают уже сейчас. Выглядеть будут так
<demotivator id="t1" title="Узбагойтесь" subtitle="Сделаем вовремя">
<img src="http://im2-tub-ru.yandex.net/i?id=137949638-61-72&n=21"/>
</demotivator>
А работать так
<!DOCTYPE HTML>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.0.3.min.js"> </script>
</head>
<body>
<style>
demotivator{
background-color:black;
display:block;
color:white;
width:250px;
padding:10px;
}
demotivator img{
width:100%;
}
demotivator h1{
text-align:center;
margin:0px;
}
demotivator h2{
text-align:center;
margin:0px;
}
.red{
background-color:red;
}
</style>
<script>
$(function(){
//функция шаблонизатор
function template(data){
return "<h1>"+data.title+"</h1>"+
"<h2>"+data.subtitle+"</h2>"
}
//конструктор плагина
var Plugin=function(el){
el.append(
template({
title:$(el).attr('title')||"",
subtitle:$(el).attr('subtitle')||""
})
);
this.el=el;
}
// прототип плагина
Plugin.prototype={
//демонстрационный метод
red:function(){
this.el.addClass('red');
}
}
//автоматическое создание
$('demotivator').each(function(){
$(this).data('widget', new Plugin( $(this) ) );
})
})
//Тест управления виджетом из вне.
$(function(){
$('#btn1').click(function(){
$('#t1').data('widget').red();
})
})
</script>
<demotivator id="t1" title="Узбагойтесь" subtitle="Сделаем вовремя">
<img src="http://im2-tub-ru.yandex.net/i?id=137949638-61-72&n=21"/>
</demotivator>
<button id="btn1"> Волшебная кнопка </button>
<demotivator id="t2" class="red" title="Уcпакойтесь" subtitle="Сделаем вовремя">
<img src="http://im2-tub-ru.yandex.net/i?id=137949638-61-72&n=21"/>
</demotivator>
</body>
</html>
|
Цитата:
 |
| Часовой пояс GMT +3, время: 05:38. |