О нас Форум Баннеры RSS картинка Нас уже 577, Присоединяйся
Пожаловаться

Нашёл на одном сайте красивый дизайн для ajax окон,
Немного улучшил и добавил кое что своё.
Думаю вам они понравятся..


Установка:

Установить эти ajax окна можно по разному
1) Вставить в "Верхнюю часть сайта" код подгрузки css файла:
Code
<style type="text/css">  
  @import url('http:/serv/ajax/ajaxgreen/ajax.css') all;  
  </style>


2)Добавить в ПУ в конец Таблицы Стилей(CSS) этот код:
Code
/*ajax css*/  
  .xw-tl{background:url('http:/serv/ajax/ajaxgreen/new_left.png') no-repeat 0 0 !important;padding-left:14px !important;position:relative;zoom:1;}  
  .xw-tr{background:url('http:/serv/ajax/ajaxgreen/new_right.png') no-repeat 100% 0 !important;padding-right:14px !important;position:relative;zoom:1}  
  .xw-tc{background:url('http:/serv/ajax/ajaxgreen/new_horiz.png') repeat-x 0 0 !important;font-size:1px;line-height:1px;overflow:hidden;position:relative;zoom:1;height:41px}  
  .xw-tsps{height:10px}  
  .xw-ml{background:url('http:/serv/ajax/ajaxgreen/new_vert.png') repeat-y 0 0 !important;padding-left:13px !important;zoom:1;}  
  .xw-mr{background:url('http:/serv/ajax/ajaxgreen/new_vert.png') repeat-y 100% 0 !important;padding-right:13px !important;zoom:1;}  
  .xw-plain .xw-mc{background:url('http:/serv/ajax/ajaxgreen/new_contentbg.png') #ffffff repeat-x !important;padding:0 5px !important;margin:0;font-size:11px; color:#606060; font-family:tahoma,arial,helvetica,sans-serif;background:white;color:black;zoom:1; border:none !important;}  
  .xw-bl{background:url('http:/serv/ajax/ajaxgreen/new_bleft.png') no-repeat 0 100% !important;padding-left:16px !important;zoom:1;}  
  .xw-br{background:url('http:/serv/ajax/ajaxgreen/new_bright.png') no-repeat 100% 100% !important;padding-right:16px !important;zoom:1}  
  .xw-bc{background:url('http:/serv/ajax/ajaxgreen/new_bhoriz.png') repeat-x 0 100% !important;overflow:hidden;font-size:1px;line-height:1px;height:16px !important;}  
  DIV.xw-bcm{height:10px}  
  /*cursors for resizing frame*/  
  .xw-resize .xw-tl {cursor:nw-resize}  
  .xw-resize .xw-tr {cursor:ne-resize}  
  .xw-resize .xw-sps,.xw-resize .xw-tsps {cursor:n-resize}  
  .xw-resize .xw-ml {cursor:w-resize}  
  .xw-resize .xw-mr {cursor:e-resize}  
  .xw-resize .xw-mc {cursor:default}  
  .xw-resize .xw-bl {cursor:sw-resize; display: block !important;}  
  .xw-resize .xw-br {cursor:se-resize}  
  .xw-resize .xw-bc {cursor:s-resize}  
  /*header and content*/  
  .xw-plain .xw-body{border:0px solid #FFFFFF !important;background:transparent !important;}  
  .xw-sps {height:4px;overflow:hidden;position:absolute;width:100%;z-index:1}  
  .xw-hdr{padding:1px 0 0 0;white-space:nowrap;zoom:1;height:35px}  
  .xw-plain .xw-icon {height:16px;width:16px;margin:6px 4px 0 0;vertical-align:-3px;}  
  .xw-hdr-text{color:#454545; font-weight:bold; font-size:12px; font-family: tahoma,arial,verdana,sans-serif !important;line-height:40px !important; vertical-align:2px; padding-left:7px;}  
  .xw-active .xw-hdr-text {color:#454545;}  
  .xw-disabled, .xw-actlayer {background: url(http:/serv/ajax/ajaxgreen/1px.gif) !important;}  
  .xw-active .xw-actlayer {display:none}  
  .xw-draggable,.xw-draggable .xw-hdr-text{cursor:move !important}  
  /*buttons*/  
  .xt{position:relative;width:25px;height:18px;overflow:hidden;float:right;display:inline;cursor:pointer;background:url(http:/serv/ajax/ajaxgreen/ab.png) no-repeat !important;}  
  .xt-close{width:44px !important;background-position:-44px 0 !important;}  
  .xt-close2 {width:44px !important;background:url(http:/serv/ajax/ajaxgreen/cb.png) no-repeat -44px 0 !important;margin-bottom:-10px;}  
  .xt-mini{width:26px !important;background-position:-26px -18px !important;}  
  .xt-maxi{background-position:-25px -36px !important;}  
  .xt-rest{background-position:-25px -54px !important;}  
  .xt-reload{background-position:-25px -72px;margin-right:5px !important;}  
  .xt-help{background-position:-25px -90px;margin-right:5px !important;}  
  .xt-save{background-position:-25px -108px;margin-right:5px !important;}  
  .xt-close-over{background-position:0 0 !important;}  
  .xt-mini-over{background-position:0 -18px !important;}  
  .xt-maxi-over{background-position:0 -36px !important;}  
  .xt-rest-over{background-position:0 -54px !important;}  
  .xt-reload-over{background-position:0 -72px !important;}  
  .xt-help-over{background-position:0 -90px !important;}  
  .xt-save-over{background-position:0 -108px !important;}  
  .xw-dragging .xw-tl {  
  opacity: 1 !important;  
  filter: Alpha(Opacity='100') !important;  
  }  
  .xw-dragging {opacity: 0.8 !important;}  
  .xw-dragging .xw-ml {display: block !important;}  
  .xw-dragging .xw-ml .myWinCont table {display: none !important;}  
  .xw-blank {background:#a3bae9;opacity:0.4;filter:Alpha(Opacity='40');overflow:hidden; display: none !important;}  
  .myWinCont {-moz-user-select:text}  
  .myWinGrid {background:url(http://s1.unet.com/img/d/1/g.gif) repeat !important;}  
  .myWinCont,.myWinCont td, .myWinCont dl,.myWinCont dt {color:#606060;font-size:8pt;font-family:Tahoma,Arial;}  
  .myWinCont a:link, .myWinCont a:visited{text-decoration:none;color:#0066CC;}  
  .myWinCont a:hover,.myWinCont a:active{text-decoration:underline;color:#3399FF;}  
  .myWinCont a.withBack:link, .myWinCont a.withBack:visited {padding:3px;}  
  .myWinCont a.withBack:hover, .myWinCont a.withBack:active {text-decoration:none;padding:3px;background:#53A9FF;color:#FFFFFF;}  
  .myWinError {color:red;}  
  .myWinSuccess {color:blue;}  
  .myBtnCont {padding:0 4px 2px 4px;width:auto;white-space:nowrap;cursor:pointer;}  
  .myBtnCont a:link, .myBtnCont a:visited, .myBtnCont a:hover, .myBtnCont a:active {text-decoration:none; font-family:tahoma,arial,verdana; color:#000000; font-size:8pt;}  
  .myBtnDis a:link, .myBtnDis a:visited, .myBtnDis a:hover, .myBtnDis a:active {color:#B3B3B3;cursor:wait;}  
  .myBtnLeftA {background: transparent url('http://s1.uid.me/img/d/1/btn-sprite.gif') no-repeat 0 -133px !important;}  
  .myBtnRightA {background: transparent url('http://s1.uid.me/img/d/1/btn-sprite.gif') no-repeat 0 -152px !important;}  
  .myBtnCenterA {background: #E3E7EB url('http://s1.uid.me/img/d/1/btn-sprite.gif') repeat-x 0 -171px;height:19px !important;}  
  .overBtn .myBtnLeftA,.downBtn .myBtnLeftA,.overBtn .myBtnLeft,.downBtn .myBtnLeft {background-position: 0 -57px !important;}  
  .overBtn .myBtnRightA,.downBtn .myBtnRightA,.overBtn .myBtnRight,.downBtn .myBtnRight {background-position: 0 -76px !important;}  
  .overBtn .myBtnCenter,.overBtn .myBtnCenterA {background-position: 0 -95px !important;}  
  .downBtn .myBtnCenter,.downBtn .myBtnCenterA {background-position: 0 -114px !important;}  
  .myBtnLeftA, .myBtnRightA, .myBtnLeft, .myBtnRight {width:3px;height:19px;white-space:nowrap;}  
  .myBtnLeftA img, .myBtnRightA img, .myBtnLeft img, .myBtnRight img {width:3px;}  
  .myBtnLeft {background: transparent url('http://s1.uid.me/img/d/1/btn-sprite.gif') no-repeat 0 0 !important;}  
  .myBtnRight {background: transparent url('http://s1.uid.me/img/d/1/btn-sprite.gif') no-repeat 0 -19px !important;}  
  .myBtnCenter {background: #E3E7EB url('http://s1.uid.me/img/d/1/btn-sprite.gif') repeat-x 0 -38px;height:19px !important;}  

  /* ============== */  
  .xstl, .xstr, .x-sh {display:none !important;}  
  .xt-mini {background:url('http:/serv/ajax/ajaxgreen/new_buttons.png') no-repeat 0px 0px !important; width:19px !important; height:19px !important; margin:10px 0px 0px 5px !important; padding:0px !important;}  
  .xt-mini:hover {background-position:0px -19px !important;}  
  .xt-maxi {background:url('http:/serv/ajax/ajaxgreen/new_buttons.png') no-repeat -19px 0px !important; width:19px !important; height:19px !important; margin:10px 0px 0px 5px !important; padding:0px !important;}  
  .xt-maxi:hover {background-position:-19px -19px !important;}  
  .xt-close {background:url('http:/serv/ajax/ajaxgreen/new_buttons.png') no-repeat -38px 0px !important; width:19px !important; height:19px !important; margin:10px 0px 0px 5px !important; padding:0px !important;}  
  .xt-close:hover {background-position:-38px -19px !important;}  
  .myWinCont{width: 99% !important;}


Готово..

Если хотите, чтобы картинки для окон загружались с вашего сайта,
Скачайте rar архив (ниже) в котором находятся нужные изображения
И загрузите в корень сайта, потом изменив в коде ссылки на них..


Спонсор :



Источник: http://igrotorrent.ru
Всего голосов: ... | ... | ...

Всего комментариев: 4
Hаписал: devil , 06.10.2012 Суббота 20:33 Сообщение #1
OFFLINE
+ 0 -

Окно принадлежит http://igrotorrent.ru
а изменил ты в нем только внутренний вид

Hаписал: Fatal1ti , 07.10.2012 Воскресенье 12:01 Сообщение #2
Fatal1ti
Администратор
OFFLINE
+ 1 -

Источник поставил на сайт..
Попробуй своё ajax окно перетащить
Вот такое получится:
/serv/1zxc.jpg

А я поправил и сделал чтобы было так:
/serv/12344.jpg

Hаписал: devil , 07.10.2012 Воскресенье 16:41 Сообщение #3
OFFLINE
+ 0 -

ты сейчас 2 скрина сделал ) разных
1. список смайлов
а в 2. опрос :)

Hаписал: devil , 07.10.2012 Воскресенье 16:42 Сообщение #4
OFFLINE
+ 0 -

Ну а так молодец )
могу подарить информетер на форум ) посмотри ) на сайте

Информация


Посетители, находящиеся в группе Гость, не могут оставлять комментарии к данной публикации.
Пожалуйста войдите на сайт как пользователь или зарегистрируйтесь.

Логотип сайта:
Навигация
Мини-чат
Витрина Активистов
Опрос
Как вы попали сюда?

Всего ответов: 198
Последние комментарии
  • Fatal1ti
    Оставлен 05.02.2013
    50+ качественных анимированных иконок загрузки для сайта
    Автор комментария: Fatal1ti
    Оставлен 05.02.2013 в 16:19
    Тема: 50+ качественных анимированных иконок загрузки для сайта
    Это просто gif картинки,
    А чтобы при загрузке страницы крутилась анимация, нужен скрипт
  • sasha26
    Оставлен 04.02.2013
    Новый, светлый мини-чат как на Zagruzka-Plus для uCoz
    Автор комментария: sasha26
    Оставлен 04.02.2013 в 12:43
    Тема: Новый, светлый мини-чат как на Zagruzka-Plus для uCoz
    С цветами разобрался, пришлось путь к файлу zvetaf.xml полностью писать.
  • sasha26
    Оставлен 04.02.2013
    Новый, светлый мини-чат как на Zagruzka-Plus для uCoz
    Автор комментария: sasha26
    Оставлен 04.02.2013 в 12:32
    Тема: Новый, светлый мини-чат как на Zagruzka-Plus для uCoz
    Что-то окно с цветами начинает открываться и сразу же пропадает.
    А как можно чат растянуть по высоте с 300рх до 500рх, где это меняется?
  • Mihail
    Оставлен 01.02.2013
    Замена alert на ajax окно с прямой ссылки к сообщению на форуме
    Автор комментария: Mihail
    Оставлен 01.02.2013 в 17:12
    Тема: Замена alert на ajax окно с прямой ссылки к сообщению на форуме
    А вот это супер )
  • Fatal1ti
    Оставлен 31.01.2013
    Форма добавления комментариев как на dle для uCoz
    Автор комментария: Fatal1ti
    Оставлен 31.01.2013 в 18:23
    Тема: Форма добавления комментариев как на dle для uCoz
    Должно работать, у некоторых файл zvetaf.xml
    Повреждается при загрузке, попробуй его перезалить

    Если ничего не изменяется, то ищи в коде такую строчку:
    Код
    <img src="http:/bbcodes/color.gif" id="kmn" title="Выбрать цвет" onclick="openLayerB('sda',0,'/bbcodes/zvetaf.xml','Выбор цвета',190,200,'1','','',0,'justify');return false;">


    И меняй на эту:
    Код
    <script type="text/javascript" src="http:/serv/zvet.js"></script>
    <img src="http:/bbcodes/color.gif" id="kmn" title="Выбрать цвет" onclick="viewzvet()">

    Должно заработать..
  • Fatal1ti
    Оставлен 27.01.2013
    Зелёное меню как на we-place для uCoz
    Автор комментария: Fatal1ti
    Оставлен 27.01.2013 в 15:05
    Тема: Зелёное меню как на we-place для uCoz
    DevilShadow, извини что сразу не ответил
    Чтобы счетчики были справа нужно в css найти такую строчку:
    Код
    .coole div {position: relative;margin-left: 173px;z-index: 1;}

    И заменить на эту
    Код
    .coole div {position: relative;margin-left: 219px;z-index: 1;}


    А чтобы и фото счетчик был, нужно после этой строчки:
    Код
    <script type="text/javascript" src="http://worldinfo.my1.ru//informer/6"></script>

    Добавить эту:
    Код
    <script type="text/javascript" src="http://worldinfo.my1.ru//informer/7"></script>


    И после скрипта, который находится снизу после меню, добавь ещё скрипт:
    Код
    <script type="text/javascript">  
      function setCatNumEnt(){  
      if(!window.uCatsOut)return;  
      $('div.naviglot a').each(function(){  
      var a=this,ah=a.href,cArr=window.uCatsOut;  
      if(!/\/photo\//.test(ah))return;  
      var t=ah.split('/'),id=t[t.length-1]||t[t.length-2],a=$(a).parent();  
      if(!isNaN(id)){  
      $.each(cArr,function(j){  
      if(cArr[j][0]==id){  
      a.prepend('</span><div class="coole"><div><span class="vnav-subnav2">'+cArr[j][6]+'</span></div></div>');  
      }  
      });  
      };  
      });  
      };setCatNumEnt();
      </script>
Статистика
Онлайн всего: 1
Гостей: 1
Пользователей: 0

Сегодня зашли на сайт
0 пользователя

Новых пользователей:
За месяц: 17
За неделю: 6
Вчера: 0
Сегодня: 0
У нас нашли
Загрузка...
Друзья сайта
Наш Баннер
Всё для новичков
Всё для новичков