ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / jquery или сделать самому?
19 сообщений из 19, страница 1 из 1
jquery или сделать самому?
    #36502688
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
Приблуд вроде не особо много - определение точной позиции static элемента относительно окна браузера, плавно разворачивающиеся/сворачивающиеся блоки, постепенное появление полупрозрачного блока (fadeIn), назначение всем дочерним элементам конкретного блока определённых свойств (точнее фона), обработка в js-файле событий элементов с определённым id или свойством.
В самой странице написание скриптов запрещено, только отдельно подключаемый кешируемый *.js.
Вроде всё.
Вопрос - долго это всё самому переделывать на js или лучше оставить всё как есть, на jquery - 56 кб (хотя большинство из них ненужного мусора, но интернет нынче быстрый в крупнейших городах России)?
...
Рейтинг: 0 / 0
04.03.2010, 15:17:47
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36502703
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
st_st,

Самому - раз плюнуть.
...
Рейтинг: 0 / 0
04.03.2010, 15:20:17
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36502705
Фотография Яростный Меч
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Яростный Меч
Участник
st_stjquery - 56 кбУ иных страниц html на 50 мб, так что для одной загрузки это вообще копейки
...
Рейтинг: 0 / 0
04.03.2010, 15:20:46
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36508588
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
Яростный Мечst_stjquery - 56 кбУ иных страниц html на 50 мб, так что для одной загрузки это вообще копейки

Встречаются и мегабайтные страницы, но в основном у начинающих.
56 кб тоже много, на dial-up в лучшем случае 12 секунд загрузки только одного js (если конечно не включен gzip/deflate). Поэтому хочется как можно больше уменьшить вес страницы.
...
Рейтинг: 0 / 0
09.03.2010, 12:19:35
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36512272
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
Так, jquery понемногу поддаётся.
авторопределение точной позиции static элемента относительно окна браузера jquery делать это вроде неумеет (глючный offset() даже не рассматриваем), ну да ладно, полный перебор parent + дописывание корректировочных пикселей решило проблему.
авторобработка в js-файле событий элементов с определённым id решено.
авторобработка в js-файле событий элементов с определённым стилемв стадии разработки.
Допустим у элемента есть стили - "bn bs". Пока первое, что пришло на ум, через indexOf найти например bn и проверить символы справа и слева на пробелы и ". Есть ли более красивые варианты?
...
Рейтинг: 0 / 0
10.03.2010, 17:18:07
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36512302
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
st_st...Допустим у элемента есть стили - "bn bs". Пока первое, что пришло на ум, через indexOf найти например bn и проверить символы справа и слева на пробелы и ". Есть ли более красивые варианты?
Нехорошо как-то по стилю. Может лучше такому элементу какой-нибудь "левый" атрибут присвоить, например:
Код: plaintext
<div leftattr="чего-то там"></div>
и проверять атрибут leftattr?
...
Рейтинг: 0 / 0
10.03.2010, 17:26:37
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36512392
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
Элементам можно id присвоить и по нему изменять свойства стилей. Но тут тоже вопрос, если многим элементам задан один и тот же стиль и по нему можно обратиться к ним, зачем тогда id. Навеяно от jquery - "$(.bn)".
Пока код такой:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
var allTags=new Array();

function getClass(theClass,node,tag,stl,ord) {

if (node==null) node=document;
if (tag==null) tag='*';

var allTags=node.getElementsByTagName(tag);

	for (i= 0 ; i<allTags.length; i++) {

		if (allTags[i].className==theClass) {

		eval('allTags[i].style.'+stl+'=ord');

		}
	}
}
Вызов:
Код: plaintext
1.
getClass('bc bn',this,null,'background','url("/images/but_back.gif") repeat-x');
html:
Код: plaintext
1.
<div class="bc bn">xxx</div>
Приходится указывать два класса - 'bc bn', хотя изменения должны быть сделаны элементам класса 'bc', назависимо, в паре он с другими классами или нет. Поэтому хочется идентифицировать 'bc' как класс, может ведь быть 'abcd xxx', indexOf выдаст наличие 'bc', но это никак не класс. Пока думаю +- символом искать пробел, либо ", но может есть идея лучше.
...
Рейтинг: 0 / 0
10.03.2010, 17:52:45
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36513108
Фотография iConst
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
iConst
Участник
.hasClass( className )
Перевернув мир - оглянись, может перевернулся ты сам?!
...
Рейтинг: 0 / 0
11.03.2010, 09:19:42
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36514373
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
.hasСlass - это что-то вроде из jquery, от которого и пытаюсь избавиться.

Пока набросал код, сверяю по пробелам, ещё не тестировал, получилось нечто вроде:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
// if (allTags[i].className==theClass)  //bc==bc// { return; } иначе - 
var i= 0 ;
var valid= 0 ;
var x='bc bn bf';
var cls='bn';
while (x.indexOf(cls,i)!=- 1 ) {
	items=x.indexOf(cls,i);

	// берём предыдущий символ, спереди ничего нет

	if ((items+cls.length==x.length) && (items!= 0 )) {
		symb=x.substr(x.length-(cls.length+ 1 ), 1 );
		if (symb==" ") { valid= 1 ; break; }
	}
	else {

		// берём следующий символ, сзади ничего нет

		if ((cls.length!=x.length) && (items== 0 )) {
				symb=x.substr(cls.length, 1 );
				if (symb==" ") { valid= 1 ; break; }
		}
		else {

		// берём по символу спереди и сзади

			if ((items+cls.length!=x.length) && (items!= 0 )) {
				symb1=x.substr(items- 1 , 1 );
				symb2=x.substr(items+cls.length, 1 );
				if ((symb1==" ") && (symb2==" ")) { valid= 1 ; break; }
			}
		}
	}
i=x.indexOf(cls,items+cls.length);
if (i==- 1 ) break;
}

alert(valid);
Осталось это всё соединить с главной функцией и прогнать на предмет ошибок.

ShSerge
Самому - раз плюнуть.


С пивом нормально. А без оного процесс как-то медленно идёт.
...
Рейтинг: 0 / 0
11.03.2010, 15:39:59
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36517318
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
Соединено, проверено, вроде работает.
Получилось так:
Код: plaintext
1.
getClass('bm',null,null,'func','onmouseover',"getClass('bc',this,null,'css','background','url(/images/but_back.gif) repeat-x');getClass('bd',this,null,'css','background','url(/images/but_l.gif) no-repeat');");
что означает - при наведении указателя мыши на элемент с классом 'bm', изменять фон у дочерних элементов с классами 'bc' и 'bd'.

Выглядит немного криво по сравнению с jquery -
Код: plaintext
1.
2.
3.
4.
$(".bm").hover(function(){ 
$(this).children(".bc").css("background","url('/images/but_back.gif') repeat-x");
$(this).children(".bd").css("background","url('/images/but_l.gif') no-repeat");
});
но зато в сумме весит всё это дело намного меньше.

Осталось последних 3 испытания и прощай jquery -
Код: plaintext
1.
2.
3.
 1  - $(document).not('#m_sh').click(function() { });
 2  - $('#cat').slideToggle('slow');
 3  - $("#l_cnt").fadeOut("slow");
Если есть мысли как реализовать, пишите (код особо не нужен).

P.S. Сам пока не искал решений и не вникал в оставшиеся 3 пробемы.
...
Рейтинг: 0 / 0
12.03.2010, 17:03:59
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36518020
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
Добавил function, чтобы в одной строке обработчик не писать.
Код: plaintext
1.
2.
3.
4.
getClass('bm',null,null,'func','onmouseover',function() {
	getClass('bc',this,null,'css','background','url(/images/but_back.gif) repeat-x');
	getClass('bd',this,null,'css','background','url(/images/but_l.gif) no-repeat');
});
Первая проблема -
Код: plaintext
1.
 1  - $(document).not('#элемент').click(function() { });
Решение -
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
$x('элемент').onclick=function(e) {
открыть_элемент;
e=e||window.event; // internet explorer иначе не понимает
e.stopPropagation?e.stopPropagation():(e.cancelBubble=true); // опять этот ie...
}

document.onclick=function() {
if (элемент_открыт) закрыть_элемент;
}
Осталось теперь плавное раздвижение и нарастающее уменьшение прозрачности.
...
Рейтинг: 0 / 0
13.03.2010, 10:15:55
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36519942
Фотография vladgrig
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
vladgrig
Участник
авторДопустим у элемента есть стили - "bn bs". Пока первое, что пришло на ум, через indexOf найти например bn и проверить символы справа и слева на пробелы и ". Есть ли более красивые варианты?
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
HTMLDocument.prototype.getElementsByClassName = function (c) {       
        var a = [];
        var r = new RegExp('\\b' + c + '\\b');
        var e = this.getElementsByTagName("body")[ 0 ].getElementsByTagName("*");
        for (var i =  0 , j = e.length; i < j; i++) if (r.test(e[i].className)) a.push(e[i]);
        return a;
};
вызов
Код: plaintext
1.
var ele = document.getElementsByClassName("bs");
Успехов!
...
Рейтинг: 0 / 0
15.03.2010, 02:30:18
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36520484
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
vladgrig , спасибо, забыл я совсем о регулярках, да и запомнить их всё никак не могу.

Обновлённый код:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
function getClass(cls,node,tag,type,stl,ord) {

var r=new RegExp('\\b' + cls + '\\b');

if (node==null) node=document;
if (tag==null) tag='*';

var allTags=node.getElementsByTagName(tag);

	for (i= 0 ; i<allTags.length; i++) {

		if (r.test(allTags[i].className)) {

			if (type=='css') eval('allTags[i].style.'+stl+'=ord');

			if (type=='func') eval('allTags[i].'+stl+'='+ord);

		}
	}
}
Вызов:
Код: plaintext
1.
2.
3.
4.
getClass('bm',null,null,'func','onmouseover',function() {
	getClass('bc',this,null,'css','background','url(/images/but_back.gif) repeat-x');
	getClass('bd',this,null,'css','background','url(/images/but_l.gif) no-repeat');
});
...
Рейтинг: 0 / 0
15.03.2010, 12:06:45
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36520745
Фотография vladgrig
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
vladgrig
Участник
хм...
а ты не мог бы словами объяснить, что должен делать твой код? + кусочек искомой разметки.
я так понял - в элементе с класснэйм "bm" по маусовер у дочерних элементов с класснэйм "bc" и "bd" поменять бэкграунд!?
ИМХО ты как то не так, и не туда идёшь!
...
Рейтинг: 0 / 0
15.03.2010, 13:30:44
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36520947
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
При возникновении события (всего, что начинается на "on" - onclick, onfocus и т.д.) у элемента с определённым классом, назначать свойства/обработчики_функций его определённым дочерним элементам, которые могут распознаваться как по классу, так и по id.

Приведённый код вызова - это один из частных примеров.
...
Рейтинг: 0 / 0
15.03.2010, 14:15:29
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36524489
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
Добрался до прозрачности - opacity, плавное появление/исчезание элемента.
В IE js сильно тормозит по сравнению с другими браузерами. Видимо придётся делать поправку на задержку вызова функции. C jquery точно так же тормозил, но там оставили всё как есть. К тому же ie (даже восьмой) не понимает стилевое свойство opacity, приходится лепить через фильтры.
...
Рейтинг: 0 / 0
16.03.2010, 18:13:41
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36527312
Фотография vladgrig
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
vladgrig
Участник
авторПри возникновении события (всего, что начинается на "on" - onclick, onfocus и т.д.) у элемента с определённым классом, назначать свойства/обработчики_функций его определённым дочерним элементам, которые могут распознаваться как по классу, так и по id.

Приведённый код вызова - это один из частных примеров.
Ну незнаю, у мну получилось вот так:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
$ = function(context) {

    var o = [];
    
    o.children = function(context) {

        for (var i =  0 ; i < this.length; i++) {
            return $(context, this[i]);
        }
    }
    o.mouseover = function(func) {

        attachEvent(this, "mouseover", func);
        return o;
    }
    o.mouseout = function(func) {

        attachEvent(this, "mouseout", func);
        return o;
    }
    o.style = function(val) {

        for (var i =  0 ; i < this.length; i++) {
            this[i].style.cssText = val; ;
        }
    }
    function attachEvent(ele, event, func) {

        for (var i =  0 ; i < ele.length; i++) { 

            eval("ele[i].on" + event + "=" + func);
        }
    }

    var classname = $.arguments[ 0 ];
    var ele = $.arguments[ 1 ];
    var regexp;

    if (typeof (classname) == "string") {

        regexp = new RegExp('\\b' + classname.slice( 1 ) + '\\b');
    }
    else {

        o.push(classname)
        return o;
    }

    ele = (ele ? ele : document).getElementsByTagName("*");

    for (var i =  0 ; i < ele.length; i++) {

        if (regexp.test(ele[i].className)) o.push(ele[i]);
    }

    return o;
}
Стр. с вызовом:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
    <script type="text/javascript">
        function doWork() {
            
            $(".bm")
            .mouseover(
                function() {
                    $(this).children(".bp").style("background-color:Black;");
                }
            )
            .mouseout(
                function() {
                    $(this).children(".bp").style("background-color:White;");
                }
            );
        }

    </script>

    <p class="bm">
        this is bm <b class="bp">this is bp</b><b>this is bp  1 </b><b class="bp">this is bp  2 </b>
    </p>
    <p>
        this is p <b>this is b in p</b>
    </p>
    <p class="bm">
        this is bm <b class="bp">this is bp</b><b>this is bp  1 </b><b class="bp">this is bp  2 </b>
    </p>
    <input id="Button1" onclick="doWork();" type="button" value="button" />
Не всё гладко, конечно. НО! Понравилась возможность расширять и дополнять (в стиле ООП!)

ЗЫ: вообще было интересно - даже книгу начал читать LOL! ;)
...
Рейтинг: 0 / 0
18.03.2010, 03:26:28
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36541699
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
Немного занят был укрощением ie6, пришлось пока отвлечься от этого js.
Код пока не пробовал в деле, но на первый взгляд вроде должно нормально работать. Событий впринципе не так много (onclick, onmouseover, onfocus и т.д.), можно пожертвовать (кило)байтами кода и все их перечислить.
Ладно, закончу с ie6 и вернусь к этому вопросу.

По теме ie6 -
Код: plaintext
1.
2.
3.
4.
.h {
width:expression(document.body.clientWidth <  980 ? "980px": "auto");
width:expression(document.getElementById('pad').offsetWidth< 980 ?'980px':'auto');
}
от любой из этих строк при ширине <980 (можно открыть в развёрнутом окне и затем устроить ресайз) ie6 намертво виснет и ietester тоже. Пока ищу причину.

Ещё ie6 при position:absolute непонимает одновременно заданные параметры положения (например top и bottom), hover непонимает, png прозрачность непонимает и т.д., всё заменяется js. В итоге скриптов получилось больше, чем css.
...
Рейтинг: 0 / 0
25.03.2010, 11:40:36
| Ответить | Цитировать | Написать  
jquery или сделать самому?
    #36541880
st_st
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
st_st
Участник
Решение -
Код: plaintext
1.
width:expression(document.getElementById('pad').offsetWidth< 981 ?'980px':'auto');
нужен дополнительный минимум 1 пиксель, иначе ie6 уходит в бесконечный цикл (видимо так задумано создателем ie6).
...
Рейтинг: 0 / 0
25.03.2010, 12:28:23
| Ответить | Цитировать | Написать  
19 сообщений из 19, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / jquery или сделать самому?
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=36520745&tid=1453331]:
 0ms
get settings:
 6ms
get forum list:
 11ms
check forum access:
 2ms
check topic access:
 2ms
track hit:
 188ms
get topic data:
 7ms
get forum data:
 2ms
get page messages:
 38ms
get tp. blocked users:
 1ms
others: 195ms
total:  452ms
созд. / загр.: 452ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]