Главная - Все для web-мастера uCoz

Выбор аватара в ajax окне by укозик

Выбор аватара в ajax окне by укозик
Вот и вышел на свет скрипт который я так долго собирался написать. При регистрации пользователям можно выбрать аватары предоставленные вами. Также можно создавать свои коллекции, но название категорий стандартными методами не переименуешь, вот для этого случая и пригодиться данный скрипт. Он переименовывает стандартные название на представленные Ваши, переименовывает заголовок списка и не менее важное это то, что все теперь это происходит в ajax окне.
Установка:

Страница редактирования данных пользователя, в < head>:

Code
<style>
td, body {font-family:Tahoma,Arial,Helvetica; font-size:8pt}
input,textarea,select {font-size:10px; font-family:verdana,arial,helvetica}
.menu {padding: 0 0 0 13px; background: url('http://s105.ucoz.net/img/ma/a2.gif') no-repeat 3px 4px;}
#menuId{
float:left;
width:20%;  
min-height:400px;
}
#conId{
float:left;
width:79%;
}
#abId{font-size:14px;
margin: 180px 5px;
}
a:link{color:#000!important;}
a:visited{color:#000!important;}
a:hover{color:#999!important;}
a:active{color:#000!important;}
.page{display:none}
.cursor{cursor:pointer}
</style>


После </ head>:

Code
<script type="text/javascript">
$(document).ready(function(){
/*© укозик.рф*/  
  var m = ["Ваше название 1","Ваше название 2"];
  var pole = $('#siF12');
  pole.val('$USER_AVATAR_URL$');
  function fSsilka(){
  var avat;
  $('a[href^="javascript:avatar"]').click(function(){$(this).removeAttr('href')});
  $('a img[title="Click to Select"]').click(function(){avat = $(this).attr('src');pole.val(avat);$(this).addClass('cursor');var okno = confirm('Аватар выбран. Зарыть окно?'); if(okno == true){_uWnd.close('ava')}});  
  }  
  var viborA = $('#aId');
  viborA.click(function(){  
  $('#siF11').fadeOut(2000);
  pole.delay(2000).fadeIn(2000);
  pole.removeAttr('disabled')
  });
  viborA.live("click", function(){  
  new _uWnd('ava','Коллекция аватаров',880,500,{autosize:1,maxh:880,minh:500,oncontent:function(){$('#menuId').load('index/7-1', function(){  
  $('b:contains(Коллекции сайта)').text('Аватары 140х140');  
  var schet = $('a[target=avatars]:contains(Коллекция)').length;
  var m2 = [];
  for (j=0; j < schet; j++){  
  $.makeArray($('a[target=avatars]').eq(j).html(m[j]));  
  }
  })}},'<div id="menuId">Меню</div><div id="conId"><p id="abId">Выберите категорию</p></div>');  
  });  
var ssylka  
  $('.menu').live("click",function(){  
  $(this).addClass('sKclass');  
  ssylka = $('.sKclass a').attr('href');  
$('#conId').load(ssylka,function(){$('font:contains(Коллекция)').remove();fSsilka()});
  $(this).removeClass('sKclass');  
  return false;
  });  
  $('span[dir = ltr] > a').live("click",function(){  
  var tElement = $(this).html();
  var dds = ssylka + '-' + tElement;  
  $('#conId').load(dds,function(){
  $('font:contains(Коллекция)').remove();  
  fSsilka()
  });  
  return false;
  });  
});  
</script>


Идем на страницу "Форма редактирования персональной информации"

Ищем код:

Code

<tr id="siM36"><td class="manTd1" valign="top" id="siM37">$AVATAR_SIGN$</td><td class="manTd2" id="siM38">$AVATAR_FL$</td></tr><tr><td height="10" class="manTdSep" colspan="2"><hr class="manHr" /></td></tr>


и заменяем на:

Code

<tr id="siM36"><td class="manTd1" valign="top" id="siM37">$AVATAR_SIGN$</td><td class="manTd2" id="siM38"><input id="siF12" class="manFlAvaLink" name="avatar" size="20" style="width:100%;" value="" maxlenth="150" type="text"><input id="siF11" class="manFlAvaFile" name="avau" style="width:100%;display:none;" size="20" type="file"><br>[ <a id="aId" href="javascript://" rel="nofollow">Выбрать аватар</a> | <a href="javascript://" rel="nofollow" onclick="ava(1);return false;">Загрузить свой аватар</a> ]</td></tr><tr><td height="10" class="manTdSep" colspan="2"><hr class="manHr" /></td></tr>


Инструкция по установке:

1.В настройках сайта выберите версию библиотеки jQuery: jQuery-1.6.1.js или выше

2.В настройках пользователей выберите "Персональную страницу пользователя открывать в новом окне" (Не обязательно, но так красивей)

3.Для того чтобы переименовать категории, редактируйте строку:
var m = ["Ваше название 1","Ваше название 2"];

Источник: укозик.рф

Просмотров: 987 | Написал: (o)-$erega-(o) | Дата: 23.04.2012 | Комментарии: (0)

info
Гостям нельзя оставлять комментарии. Зарегистрируйтесь или войдите под своим профилем

vk
Рекомендуем
Мини-чат
23:26
gameaslife
Парни помогите ! http://xn--g1acecr2a.xn--p1ai/board/skripty_ucoz/bot_dlja_mini_chata/1-1-0-581

19:05
380971489511
А как делать фон на сайте?

17:31
ferr-um
Страница материала - http://укозик.рф/board/skripty/umenshaem_izobrazhenija_v_informerakh_kommentakh/5-1-0-444

17:31
ferr-um
Скрипт хорош, решил потестировать и даже больше - использовать его и для уменьшения видео, так вот вроде бы все работает на IE и MF но вот Google Chrome вроде бы воспринимает скрипт, но после перезагрузки страницы картинки снова увеличенные ( кстати видео не увеличивается ) в чем может быть проблема? Заранее спасибо.

17:31
ferr-um
Я так понял сообщение отправить пока нет возможности, но вот ответ на вопрос хотелось бы получить, так как очень нужно и так:

23:02
Kulac
по моему, выглядит капельку лучше

00:51
Montik
Супер

04:46
Admin
Всем привет! Сайт переехал на новый хостинг!

Для добавления необходима авторизация
Реклама
Статистика
Яндекс.Метрика

Онлайн всего: 1
Гостей: 1
Пользователей: 0