Liga | Дата: Пятница, 14.12.2012, 02:14 | Сообщение # 1 |
Оффлайн
Администраторы
Регистрация: 25.07.2012
Сообщений: 33
IP: Скрытая информация
3
[blue]Представленный скрипт позволит накладывать на все изображения в каталоге файлов (к примеру) ваш вотермарк (Watermark). Для этого не нужен php и платный хостинг. В качестве вотермарка может выступать любое ваше изображение[/blue]
Вотермарк будет накладываться автоматически, и после установки скрипта вам не придется накладывать их на изображения вручную.
Для начала, обзаводитесь вотермарком. Для этого вам потребуется фотошоп или еще что нибудь в этом роде. Когда рисунок вотермарка будет готов, можно продолжать.
На заметку: Для всех изображений, к которым вы хотите прикрепить вотермарк, нужно прописать класс wmImage. Для примера: Code <img class="wmImage" src="http:///youscripts.at.ua/0123.jpg/" width="200" border="0">
Как только с изображениями закончено, нужно будет к странице подключить jQuery. ВНИМАНИЕ! Если у вас сайт на UCOZ, то подключать jQuery не нужно!
jQuery подключаем следующим кодом, который нужно написать в между <head> и </head>: Code <script src="http://code.jquery.com/jquery-latest.pack.js" type="text/javascript"></script>
После этого, пишем следующий код после тега <BODY>: Code <script type="text/javascript"> WMWater='Ссылка на изображение вотермарка'; WMOpacity=0.6; WMClass='wmImage'; WMPosX='98%'; WMPosY='98%'; </script> <script type="text/javascript" src="Путь к скрипту ватермарка"></script>
Путь к скрипту вотермарка это вот что: Code var WMOpacity; if(WMOpacity==undefined) WMOpacity=0.6; var WMPosX; if(WMPosX==undefined) WMPosX='98%'; var WMPosY; if(WMPosY==undefined) WMPosY='98%'; var WMWater; if(WMWater==undefined) WMWater='Ссылка на изображение вотермарка'; var WMClass; if(WMClass==undefined) WMClass='wmImage'; Watermark={ BaseUrl: 'http://szenprogs.ru/scripts/watermark/', GetImgWidth: function(obj){ var i=new Number(0); var s=$(obj).css('border-left-width'); i=Number(s.substr(0,s.length-2)); s=$(obj).css('border-right-width'); i+=Number(s.substr(0,s.length-2)); s=$(obj).css('padding-left'); i+=Number(s.substr(0,s.length-2)); s=$(obj).css('padding-right'); i+=Number(s.substr(0,s.length-2)); i+=$(obj).width(); s=i+'px'; return s; }, GetImgHeight: function(obj){ var i=new Number(0); var s=$(obj).css('border-top-width'); i=Number(s.substr(0,s.length-2)); s=$(obj).css('border-bottom-width'); i+=Number(s.substr(0,s.length-2)); s=$(obj).css('padding-top'); i+=Number(s.substr(0,s.length-2)); s=$(obj).css('padding-bottom'); i+=Number(s.substr(0,s.length-2)); i+=$(obj).height(); s=i+'px'; return s; }, GetImgLeft: function(obj){ var s=$(obj).css('left'); return s; }, GetImgTop: function(obj){ var s=$(obj).css('top'); return s; }, Init: function(){ var i=0; var s; $('img.'+WMClass).each(function(){ s='<img id="WMImageId'+i+'" src="'+Watermark.BaseUrl+'tr.gif" border="0" class="wmWater" style="position:absolute;'; s+='background:url('+WMWater+') no-repeat scroll '+WMPosX+' '+WMPosY+';'; s+='width:'+Watermark.GetImgWidth(this)+';'; s+='height:'+Watermark.GetImgHeight(this)+';'; s+='left:'+Watermark.GetImgLeft(this)+';'; s+='top:'+Watermark.GetImgTop(this)+';'; s+='" onmouseover="$(\'#WMBlockId'+i+'\').stop().show(\'fast\');" onmouseout="$(\'#WMBlockId'+i+'\').hide(\'fast\');">'; s+='<div id="WMBlockId'+i+'" style="background:#eee;display:none;position:absolute;text-align:center;font-size:8pt;padding:3px 5px;top:'+Number($(this).offset().top+2)+'px;left:'+Number($(this).offset().left+2)+'px;" onmouseover="$(this).stop();"><a href="http://szenprogs.ru/blog/2010-02-21-80/" target="_blank" title="Get Watermark Script">Watermark<\/a><\/div>'; $(this).after(s); $('#WMBlockId'+i).css('opacity',0.9); i++; }); $('img.wmWater').css('opacity',WMOpacity); } } $(document).ready(function(){ Watermark.Init(); });
Данный код копируем, вставляем в текстовой документ, вставляем ссылку на изображения вотермарка, далее нажимаем сохранить как, называем его и в конце приписываем .js, выбираем как все файлы, и ставим кодировку на UTF8! Теперь разберем параметры скрипта наложения вотермарка на изображения: [blue]WMWater - ссылка на файл вотермарка, который будет накладываться на изображения. WMOpacity - уровень прозрачности вотермарка. Значение в промежутке от 0 до 1, где 0 - полная прозрачность, а 1 - полная непрозрачность. WMClass - класс изображений, на которые будет накладываться вотермарк. WMPosX - положение вотермарка на изображении по горизонтали. Значение может быть как в процентах, так и в пикселах. Для размещения вотермарка по центру изображения задаем значение 'auto'. WMPosY - положение вотермарка на изображении по вертикали. Значение может быть как в процентах, так и в пикселах. Для размещения вотермарка по центру изображения задаем значение 'auto'.[/blue]
| |
|
| |