вторник, 31 марта 2015 г.

Видео и Аудио плееры для сайта - сделай сам

Собрать Видео и Аудио плееры можно здесь http://flv-mp3.com/

Код видео-плеера:
<OBJECT height="300" width="400"><PARAM NAME="movie" VALUE="http://flv-mp3.com/i/pic/uflvplayer_500x375.swf" /><param name="allowFullScreen" value="true" /><param name=FlashVars value="way=http://flv-mp3.com/i/pic/sample.flv&swf=http://flv-mp3.com/i/pic/uflvplayer_500x375.swf&w=400&h=300&pic=http://&autoplay=0&tools=2&skin=none&volume=70&q=&efb=50&efc=50&efs=50&efh=50&comment=<b>Самое-самое!</b>" /><param name="bgcolor" value="#" /><embed src="http://flv-mp3.com/i/pic/uflvplayer_500x375.swf"  allowFullScreen="true" type="application/x-shockwave-flash" flashvars="way=http://flv-mp3.com/i/pic/sample.flv&swf=http://flv-mp3.com/i/pic/uflvplayer_500x375.swf&w=400&h=300&skin=none&pic=http://&autoplay=0&tools=2&volume=70&q=&efb=50&efc=50&efs=50&efh=50&comment=<b>Самое-самое!</b>" bgcolor="#" width="400" height="300" /></embed></OBJECT>

Внешний вид видео-плеера:


вторник, 18 марта 2014 г.

Замена картинки при наведении курсора или как удвоить капитал




День добрый!..
Согласись, что частенько у нас возникает потаенное желание, если не разбогатеть, то хотя бы - выдать желаемое за действительно, так ведь?.. К примеру, я имею в кармане купюру достоинством 5 USD, а мне хотелось бы удвоить капитал и поиметь все 10 USD. Как мне следует поступить в этом случае? - Конечно, можно пойти на другой блог и заработать деньги в интернете, например, на Золотой Пятерке, ну а поскольку я тут пытаюсь изображать полезняшки для начинающих сайто-строителей, то поступлю несколько проще - просто заменю одну картинку при наведении на нее курсора другой. Сообразил зачем?.. - Да это же процесс создания, так называемых "активных кнопок", который нужен всегда, везде и всем!.. Дополнительные возможности такой функции - оживление картинок при наведении курсора. Показывать лучше всего на примере - вот конечный результат:




Процедура достижения поставленной цели - замены одной картинки другой при наведении курсора:
  • Загрузи обе картинки куда-нибудь (я загрузил их в начале этого сообщения) и правой клавишей мыши скопируй URL первой и второй картинок.
  • В редакторе HTML вставь в нужное место код вида: <img border="0" onmouseout="this.src='Адрес начальной картинки';" onmouseover="this.src='Адрес активной картинки';" src="Адрес начальной картинки" />
  • Чтобы привязать к полученной кнопке ссылку на страницу, несколько модернизируй код: <a href="Адрес страницы" target="_blank"><img border="0" onmouseout="this.src='Адрес начальной картинки';" onmouseover="this.src='Адрес активной картинки';" src="Адрес начальной картинки" /></a>
Уверен, что у тебя все получилось, да?.. Если нет - пиши в комментариях. До встречи на дорогах!..
 Используй FaceBook на все сто!!!

среда, 27 ноября 2013 г.

Сделай слайд-шоу в онлайне за 5 минут!..

Привет, народ! Сегодня мне на глаза попал весьма любопытный и оригинальный слайд-шоу конструктор, посмотрите и наделайте собственных слайд-шоу



Powered by TripAdvisor

четверг, 21 ноября 2013 г.

Потрясающая увеличилка для картинок

Очень эффективный способ детализировать картинку методом её динамического растягивания:

четверг, 31 октября 2013 г.

Активируем фавикону мгновенно!..

 Оживи картинку курсором!
Всем - всего хорошего!..
   Более 2 лет назад наш всеми любимый Blogger официально предоставил свободу в использовании персональных фавиконок (favicon = favourite icon), но до сих пор многие новички тратят огромное количество времени на возню с этой, сегодня просто необходимой, персонализацией. Хотя установить собственный favicon очень просто! В чем же заключаются сложности? - Основная проблема связана не с поиском подходящих значков в бескрайних базах интернета и не с установкой фавикона в шаблон блога... Основная проблема заключается в активации фавикона, поскольку все мечтают увидеть результат проделанной работы сразу же после её завершения, так ведь?.. А если не появляется фавикон, то настроение испортится у любого - такова уж наша людская натура...

Совсем недавно в блоге одного "умника" нашел такой ответ на описанную проблему: "Скорость света конечна!" - и смех и грех... Итак, после установки фавиконки - убедитесь в её наличии, как таковой в базе Блоггера по адресу http://ВашБлог/favicon.ico. Если её по этому адресу нет или появляется ваша прежняя - обновите окно и она должна появиться. Если такого не случилось - повторите внимательней процедуру установки. Если же по этому адресу вы её увидели - загляните в свой блог и еще раз обновите окно в браузере. Ну и как? Появилась?.. - Дел было на копейку ))) Кстати, обратите внимание, как выглядит ваше творение в активном и неактивном окнах - возможно потребуется небольшая доработка фона, к примеру, вот этим цветом  #A7CBF6

четверг, 24 октября 2013 г.

Маленькая кухня в большом окне

Окинув кухню полным взором, детали разгляди курсором!
(показан пример панорамного просмотра изображения при управлении курсором)


Кстати, кухня "Темза" от GlobalMebel - это твой правильный выбор!

вторник, 22 октября 2013 г.

Панорамная прокрутка изображения

Неделю назад сходил на Красноярские Столбы и, разумеется, кроме того, что зарядился бодростью и здоровьем - еще и сделал несколько классных снимков. Этот снимок (слева) пришлось склеить из нескольких фрагментов, поскольку для построения такого одного кадра просто нет точки съемки... Однако, в данном сообщении я хотел поговорить не о технике съемки и обработке изображений, а о форме представления и просмотра изображения в своем блоге. Дело в том, что, с одной стороны, хочется обозреть изображение полностью (особенно ЭТО!), а с другой - пристально рассмотреть отдельные его детали. Мне кажется, что вчера я нашел решение этой дилеммы - посмотрите на картинку и поводите по ней курсором! На мой взгляд, это достойная форма представления графической информации на любом ресурсе, не так ли?.. Если хочешь "запанорамировать" свои фотографии на Блоггере - процедура установки этого скрипта очень проста:

1. В гаджет (HTML &Java) или в HTML редакторе сообщений надо вставить этот код:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'/></script>
<style>#easy_zoom{
width:450px;
height:350px;
border:5px solid #eee;
background:#fff;
color:#333;
position:fixed;
top:35px;
left:45%;
overflow:hidden;
-moz-box-shadow:0 0 10px #555;
-webkit-box-shadow:0 0 10px #555;
box-shadow:0 0 10px #555;
/* vertical and horizontal alignment used for preloader text */
line-height:400px;
text-align:center;
}</style>
<script type="text/javascript" src="http://dl.dropbox.com/u/27675057/Easy%20Image%20Zoom/easyzoom.js"></script>
<script type="text/javascript"> 
$().ready(function() { 
$('a.zoom').each(function(i) { 
$(this).easyZoom();
}); 
}); 
</script>

(Верхняя строчка не нужна, если у вас уже используются скрипт jquery)

2. Затем вставьте идентификатор class="zoom" (в HTML-редакторе сообщения) для придания эффекта панорамного просмотра только выбранному изображению. К примеру, для моего изображения это выглядит так:

<a class="zoom" href="http://3.bp.blogspot.com/-i3Qe6qtXKD4/UmfQpSMu-UI/AAAAAAAABiY/j2D-LpyIGGk/s1600/%D0%9F%D0%B0%D0%BD%D0%BE%D1%80%D0%B0%D0%BC%D0%B001.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="141" src="http://3.bp.blogspot.com/-i3Qe6qtXKD4/UmfQpSMu-UI/AAAAAAAABiY/j2D-LpyIGGk/s200/%D0%9F%D0%B0%D0%BD%D0%BE%D1%80%D0%B0%D0%BC%D0%B001.jpg" width="200" /></a>

Вот и все дела - пробуй!..
...и, разумеется, комментируй: