Вот прежде чем начинать возиться со стилями компонентов и шаблона целиком будет полезно посмотреть, а что у нас в шаблоне за Яваскрипты подключаются...
Собственно там 4 строчки
В принципе немного, но полезно знать что там:
Строчка первая:
Вызов библиотеки JQuery. Почему грузится "jquery.simplemodal.js", а не "jquery.js", который лежит в той же папке я не знаю. Но "jquery.simplemodal.js" весит 3664 байта, а "jquery.js" весит уже 54кб… По вопросам работы этой библиотеки я вас отправлю на соответсвующие сайт, потому как мне лично пришлось покупать книжку чтобы познакомиться с этой библиотекой. Ничего сложного там нету, просто очень удобная библиотека...
Строчка вторая:
содержит всего ничего:
Для тех кто не очень активно лазил по стандартному шаблону поясню: описанные здесь пару функций обрабатывают стили формы для ввода логина и пароля естественно с применением jquery.
Для напоминания еще раз приведу форму для авторизации:
Так что ищите теперь где совпадают слова:"authModal","authform","login"...
Да и посмотрите еще где вызывается форма авторизации:
Третья строчка:
Бибилиотечка, реализующая какой-то хак — обрабатывающий фильтр для png-картинок в ИЕ с применением jquery и каких-то хитрых методов в ИЕ.
Тоже приведу код файла, на всякий случай...
Четвертая строчка:
Собственно вызов функции, использующей описанный в третьей строчке фильтр для обработки картинки с id="logoimg". Картинку эту в стандартном шаблоне думаю найдете сами.
Вставлять ли последние 2 строчки или нет смотрите сами. Возможно здесь реализуется какой-то хитрый дизайнерский ход...
Это то, что качается стандартного шаблона. Остальные яваскрипты еще подключаются компонентами и модулями.
Собственно там 4 строчки
<script src='/templates/_default_/basic/js/jquery.simplemodal.js' type='text/javascript'></script> <script src='/templates/_default_/basic/js/basic.js' type='text/javascript'></script> <script type="text/javascript" src="/templates/_default_/jquery.iepnghack.1.6.js"></script> <script type="text/javascript">$(function(){ $("#logoimg").pngfix(); })</script>
Строчка первая:
<script src='/templates/_default_/basic/js/jquery.simplemodal.js' type='text/javascript'></script>
Строчка вторая:
<script src='/templates/_default_/basic/js/basic.js' type='text/javascript'></script>
function auth(){ $.modal($('#authModal'), {overlay:75}); document.authform.login.focus(); } function hideAuth(){ $('#authModal').close; }
Для напоминания еще раз приведу форму для авторизации:
<div id="authModal" style='display:none'> <form id="authform" target="_self" style="margin: 0px;" name="authform" method="post" action="/login"> <div id="authtitle">Авторизация</div> <table cellpadding="2" cellspacing="2" align="center" id="authtable"> <tr> <td id="authtd">Логин:</td> <td id=""><input name="login" type="text" id="authinput" /></td> </tr> <tr> <td id="authtd">Пароль:</td> <td id=""><input name="pass" type="password" id="authinput" /></td> </tr> </table> <div id="authoption"><input type="checkbox" value="1" name="remember"/>Запомнить меня | <a href="/0/passremind.html">Забыли пароль?</a></div> <div id="authbutton"><input name="auth" type="submit" value="Войти" id="authbtn"/></div> </form> </div>
Да и посмотрите еще где вызывается форма авторизации:
<a href="javascript:auth()" id="ht_auth">Авторизация</a>
<script type="text/javascript" src="/templates/_default_/jquery.iepnghack.1.6.js"></script>
Тоже приведу код файла, на всякий случай...
/* * jQuery pngfix plugin * Version 1.6 (05/09/2007) * @requires jQuery v1.1.3 * * Examples at: http://khurshid.com/jquery/iepnghack/ * Copyright (c) 2007 Kush M. * Dual licensed under the MIT and GPL licenses: * http://www.opensource.org/licenses/mit-license.php * http://www.gnu.org/licenses/gpl.html */ /** * * @example * * optional if location of pixel.gif if different to default which is images/pixel.gif * $.pngfix('media/pixel.gif'); * * $('img[@src$=.png], #panel').pngfix(); * * @apply hack to all png images and #panel which icluded png img in its css * * @name pngfix * @type jQuery * @cat Plugins/Image * @return jQuery * @author jQuery Community */ (function($) { /** * helper variables and function */ $.pngfix = function(customPixel) { $.pngfix.pixel = customPixel; }; $.pngfix.getPixel = function() { return $.pngfix.pixel || '/images/pixel.gif'; }; var hack = { ltie7 : $.browser.msie && /MSIE\s(5\.5|6\.)/.test(navigator.userAgent), filter : function(src) { return "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='"+src+"')"; } }; /** * Applies ie png hack to selected dom elements * * $('img[@src$=.png]').pngfix(); * @desc apply hack to all images with png extensions * * $('#panel, img[@src$=.png]').pngfix(); * @desc apply hack to element #panel and all images with png extensions * * @name pngfix * @type jQuery * @cat Plugins/pngfix */ $.fn.pngfix = hack.ltie7 ? function() { var $$ = $(this); var base = $('base').attr('href'); // need to use this in case you are using rewriting urls if ($$.is('img') || $$.is('input')) { // hack image tags present in dom if ($$.attr('src').match(/.*\.png([?].*)?$/i)) { // make sure it is png image // use source tag value if set var source = (base && $$.attr('src').substring(0,1)!='/') ? base + $$.attr('src') : $$.attr('src'); // apply filter $$.css({filter:hack.filter(source), width:$$.width(), height:$$.height()}) .attr({src:$.pngfix.getPixel()}) .positionFix(); } } else { // hack png css properties present inside css var image = $$.css('backgroundImage'); if (image.match(/^url\(["']?(.*\.png([?].*)?)["']?\)$/i)) { image = RegExp.$1; $$.css({backgroundImage:'none', filter:hack.filter(image)}) .positionFix(); } } }); } : function() { return this; }; /** * Removes any png hack that may have been applied previously * * $('img[@src$=.png]').pngunfix(); * @desc revert hack on all images with png extensions * * $('#panel, img[@src$=.png]').iepnghack(); * @desc revert hack on element #panel and all images with png extensions * * @name pngunfix * @type jQuery * @cat Plugins/iepnghack */ $.fn.pngunfix = hack.ltie7 ? function() { var $$ = $(this); var src = $$.css('filter'); if (src.match(/src=["']?(.*\.png([?].*)?)["']?/i)) { // get img source from filter src = RegExp.$1; if ($$.is('img') || $$.is('input')) { $$.attr({src:src}).css({filter:''}); } else { $$.css({filter:'', background:'url('+src+')'}); } } }); } : function() { return this; }; /** * positions selected item relatively */ $.fn.positionFix = function() { return this.each(function() { var $$ = $(this); var position = $$.css('position'); if (position != 'absolute' && position != 'relative') { $$.css({position:'relative'}); } }); }; })(jQuery);
Четвертая строчка:
<script type="text/javascript">$(function(){ $("#logoimg").pngfix(); })</script>
Вставлять ли последние 2 строчки или нет смотрите сами. Возможно здесь реализуется какой-то хитрый дизайнерский ход...
Это то, что качается стандартного шаблона. Остальные яваскрипты еще подключаются компонентами и модулями.
Реклама #
14 лет назад #
Львенок 14 лет назад #
Народ был доволен предыдущим постом по поводу стилей, просто я хочу чтобы тексты были последовательные. Из этого потом при желании набор статей можно сделать...
У меня больше времени уходит на то чтобы собраться и сесть разбираться с Инстантом. На само написаниие уходит мало времени. Здесь в основном "copy-paste"...
14 лет назад #
Львенок 14 лет назад #
Но... весь движок раскидан на огромное кол-во составляющих...
даже сесть и разобраться в стандартном шаблоне, чтобы сделать на его основе свой собственный потребуется далеко не пять минут... Очень много здесь просто завязано узлом. Вот и приходится разбираться куда ведет одна ниточка, куда другая...
Я согласен с тем что этот пост не самый информативный, но просто так пройти мимо Яваскриптов шаблоне не мог для так сказать полноты картины...
Возможно потом придется ссылаться на этот пост...
14 лет назад #
14 лет назад #
Львенок 14 лет назад #
14 лет назад #
Львенок 14 лет назад #
Я действительно не люблю png из-за глюков с прозрачностью в ИЕ.
Я очень давно им не пользуюсь...
При возможности тратить 3 часа в МЕСЯЦ я считаю проблема с png сейчас не самая главная. В конце концов есть другие способы отображать картинки...
14 лет назад #
Олег с клещами 14 лет назад #
Бергал 14 лет назад #
Дима 14 лет назад #