15 ноября 2018

Рамка с планкой внизу




Поздравление

HTML код рамки:


    

Кнопка скрытой информации


 *

   При нажатии на кнопку меняется надпись на кнопке и открывается скрытая информация, это может быть текст или картинка. При повторном нажатии на кнопку все возвращается в начальное состояние.

HTML код кнопки со скрытой информацией:



    Вместо слов "скрытая информация" можно вставить свой текст или HTML код картинки (как в примере), а также текст с картинкой или картинку с надписью (в любом случае это будет текст + код картинки).
    Надпись на кнопке ("Развернуть") можно изменить, например, на "читать" или "смотреть".
   
    

14 ноября 2018

HTML код стрелки с шагающим человечком













Для копирования кода:

1 вариант: курсором растянуть окошко за  правый нижний уголок, выделить текст, скопировать.
2 вариант: правой кнопкой мыши, кликнув по тексту, вызвать меню, где кликом по строке "выбрать все" выделить текст и скопировать.

Чтобы сделать из стрелки ссылку, щелчком выделить стрелку, выбрать в меню редактора сообщения функцию "ссылка", в открывшемся окне указать адрес ссылки.

Всплывающее окно с картинкой при наведении курсора


Наведите курсор мыши!
Окно
Уберите курсор со ссылки, чтобы закрыть окно

HTML код всплывающего окна с картинкой:

<span style="color: black; font-family: &quot;arial&quot;; font-size: 12px;"><span style="color: #20ffff;"></span><br />
</span><br />
<h3>
<span style="color: black; font-family: &quot;arial&quot;; font-size: 12px;">
<center>
<span style="color: #20ffff;"></span></center>
</span></h3>
<span style="color: black; font-family: &quot;arial&quot;; font-size: 12px;">
<html>
<head>
<script>
var fadeOpacity=new Array();var fadeTimer=new Array();var fadeInterval=100;function fade(o,d){var obj=document.getElementById(o);if((fadeTimer[o])||(d&&obj.style.display!='block')||(!d&&obj.style.display=='block')){if(fadeTimer[o])
clearInterval(fadeTimer[o]);else
if(d)fadeOpacity[o]=0;else fadeOpacity[o]=9;obj.style.opacity="."+fadeOpacity[o].toString();obj.style.filter="alpha(opacity="+fadeOpacity[o].toString()+"0)";if(d){obj.style.display='block';fadeTimer[o]=setInterval('fadeAnimation("'+o+'",1);',fadeInterval);}else
fadeTimer[o]=setInterval('fadeAnimation("'+o+'",-1);',fadeInterval);}}
function fadeAnimation(o,i){var obj=document.getElementById(o);fadeOpacity[o]+=i;obj.style.opacity="."+fadeOpacity[o].toString();obj.style.filter="alpha(opacity="+fadeOpacity[o].toString()+"0)";if((fadeOpacity[o]=='9')|(fadeOpacity[o]=='0')){if(fadeOpacity[o]=='0')
obj.style.display='none';else{obj.style.opacity="1";obj.style.filter="alpha(opacity=100)";}
clearInterval(fadeTimer[o]);delete(fadeTimer[o]);delete(fadeTimer[o]);delete(fadeOpacity[o]);}}
</script>
<style type="text/css">
.demoPopup { border: solid 1px #333; font-family: Tahoma; font-size: 12px; display: none; position: absolute; width: 300px; z-index: 60;}
.demoPopuptitle {background: #949494;color: white; font-weight: bold; height: 3px; padding: 5px;}
.demoPopupbody {background: #ddd;  padding: 5px;  text-align: center;}
#demoPopup1 {  top: 100px;  left: 50px;}
#demoPopup2 {  top: 100px;  left: 400px;}
</style>
</head>
<body>
<span onmouseout="fade('demoPopup1',false);" onmouseover="fade('demoPopup1',true);"><span style="color: #d1f6fa;">Наведите курсор мыши!</span></span>
<div class="demoPopup" id="demoPopup1">
  <div class="demoPopuptitle">
Окно</div>
<div class="demoPopupbody">
    Уберите курсор с ссылки, чтоб закрыть<br />
    <img src="http://... .gif" width="178" />
  </div>
</div>
</body>
</html>
<body bgcolor="#923947" onunload="ByeWin()"></body> </span>





   Адрес картинки, ширина картинки, вставляемой во всплывающее окно, записаны в конце указанного выше HTML кода, выделены жирным шрифтом. 
   Цифровые значения в коде, цвета (color) можно изменять.
   
Related Posts Plugin for WordPress, Blogger...