/*Оформление кнопки баннеров*/
#code-p-wrap { width: 600px; padding:0; margin:0; background-color: #EAEAEA; font: 12px Georgia, «Times New Roman», Times, serif; color: #2d2d2d;}
#code-p-wrap a img { border: 0; }
#code-p-wrap fieldset { border: 1px solid #666; padding: 15px; }
#code-p-wrap .code-selector div { clear: both; margin: 0 0 25px 0; }
#code-p-wrap label { font-size: 14px; display: block; width: 120px; float: left; text-align: right; padding: 2px 6px; }
#code-p-wrap .code-selector select { border: 1px solid #666; width:120px}
#code-p-wrap .code-selector option { padding: 0 12px; }
#code-p-wrap .code-selector textarea { border: 1px solid #7d7858; padding: 10px; width: 375px; height: 80px; }
#code-p-wrap .note { font-size: 11px; width: 300px; margin: 0 0 0 130px; color: #666;}
#code-p-wrap .example-area { margin-left: 130px; width: 375px; text-align: center; border: 1px solid #7d7858; padding: 10px; }
#code-p-wrap .example-area img { max-width: 100%; }

<center>
   <a href=»/» target=»_blank» title=»Все для вебмастера!»>
      <img src=»/88×31.gif» style=»max-width:600px;» alt=»Все для вебмастера!» />
   </a><br /><br />
   <input value=»Код баннера» onclick=»showCode();» type=»button» />
</center>
<div id=»code» title=»Выберите код баннера для вставки на сайт» style=»display: none;»>
   <div id=»code-p-wrap»>
      <fieldset>
         <form action=»#» class=»code-selector»>
            <div>
               <label>Размер: </label>
               <select name=»type-size» id=»type-size»>
                  <option selected=»selected» value=»88×31.gif»>88 x 31</option>
                  <option value=»468×60.gif»>468 x 60</option>
                  <option value=»250×250.gif»>250 x 250</option>
               </select>
            </div>
            <div>
               <label>Код: </label>
               <textarea rows=»10″ cols=»25″ id=»code-box»>&lt;a href=»http://vipflex.ru/» title=»Все для вебмастера!»&gt;&lt;img style=»max-width:600px;» alt=»Все для вебмастера!» src=»http://vipflex.ru/88×31.gif» /&gt;&lt;/a&gt;</textarea>
                <p class=»note»>Просто скопируйте код выше и вставьте в свою страничку</p>
             </div>
          </form>
          <label>Пример: </label>
          <div class=»example-area» id=»graphic-example-area»>
             <a href=»/» target=»_blank» title=»Все для вебмастера!»><img src=»/88×31.gif» style=»max-width:600px;» alt=»Все для вебмастера!» /></a>
          </div>
          <p class=»note»>Пример баннера</p>
       </fieldset>
    </div>
</div>
<script type=»text/javascript»>
//<![CDATA[
   $(function() {
   $(«#type-size»).change(function() {
   var graphicFileName = $(«#type-size option:selected»).attr(«value»);
   var newCode = ‘<a href=»http://vipflex.ru/» title=»Все для вебмастера!»><img style=»max-width:600px;» alt=»Все для вебмастера!» src=»http://vipflex.ru/’ + graphicFileName + ‘» /></a>’;
   $(«#code-box»).text(newCode);
   $(«#graphic-example-area»).html(newCode);
        });
   });
   function showCode() {
      $(function(){
      $(‘#code’).dialog({
         autoOpen: true,
         show: ‘fade’,
         hide: ‘fade’,
         width: 622,
         });
      });
   }
//]]>
</script>

<option selected=»selected» value=»88×31.gif»>88 x 31</option>
<option value=»468×60.gif»>468 x 60</option>
<option value=»250×250.gif»>250 x 250</option>

<option value=»Здесь имя файла баннера»>Здесь описание (Размеры)</option>