Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
 
0 / 0 / 0
Регистрация: 31.03.2017
Сообщений: 4
1

Подскажите как создать плагин JQuery

31.03.2017, 14:13. Просмотров 479. Ответов 7
Метки нет (Все метки)

Нужно создать плагин JQuery для комментариев. Чтобы при наведении на комменте 2 была ссылка на коммент 1.
Суть на фото.
Жду помощи, заранее спасибо!
0
Миниатюры
Подскажите как создать плагин JQuery   Подскажите как создать плагин JQuery  
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
31.03.2017, 14:13
Ответы с готовыми решениями:

Как установить плагин слайдера jQuery
С jQuery никогда не сталкивался, но тут понадобилось установить, так как сам слайдер очень...

Как настроить плагин jquery.mmenu так же как на официальном сайте?
Нуждаюсь в помощи по настройке jquery.mmenu так же как тут. А именно не получается: открытое меню...

Подскажите как называется плагин
Доброго времени суток Вот плагин для комментирования, при нажатии на "обычные" плавно открываются...

Как исправить плагин "jQuery Vertical Mega Menu"
Добрый день. Я поставил этот плагин на свой сайт http://saitinpro.ru и все замечательно работает....

7
886 / 721 / 447
Регистрация: 13.07.2015
Сообщений: 2,241
31.03.2017, 16:29 2
лол. пишешь свою вакабу?

Добавлено через 14 минут
лови
песочница
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
div {
  width:300px;
  height:100px;
  border: 1px solid black;
  border-radius: 5px;
  background: #ccc;
}
span.link {
  color: #0f0;
  font-weight: bold;
}
span.link:before {
  content: ">>";
}
Javascript
1
2
3
4
5
6
7
8
9
10
$('span.link').mouseover(function(e){
    var id = $(this).text();
  var blok = $('#'+id).clone();
  $(blok).attr('id','clone')
        .css({'position':'absolute','top':e.pageY,'left':e.pageX});
        console.log(e);
  $('body').prepend(blok);
}).mouseleave(function(){
  $('#clone').remove();
})
HTML5
1
2
3
4
5
6
7
8
9
10
11
<div id="m1">
KEK KEK KEK KEK KEK KEK KEK KEK KEK KEK KEK KEK KEK KEK KEK KEK 
</div>
<div id="m2">
AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA
<span class="link">m1</span>
</div>
<div id="m3">
AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA AZAZA
<span class="link">m1</span>
</div>
Добавлено через 53 секунды
надо чутка допилить чтобы лесенка выстраивалась из постов, а то пока у меня только один блок показывается

Добавлено через 57 минут
сделал лесенку, она норм раскатывается, только пока обратно не убирается по ступеньком если мышку отводишь, только вся
песочница
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
div {
  width:200px;
  height:50px;
  border: 1px solid black;
  border-radius: 5px;
  background: #ccc;
}
span.link {
  color: #0f0;
  font-weight: bold;
}
span.link:before {
  content: ">>";
}
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var zind = 1, rm;
$('body').on('mouseover','span.link',function(e){
    var id = $(this).text();
  var blok = $('#'+id).clone();
  $(blok).attr('id','clone_'+id).addClass('clone')
        .css({'position':'absolute',
                    'top':e.pageY,
              'left':e.pageX,
              'z-index':zind});
  zind++;
  if($('#clone_'+id).length==0) $('body').prepend(blok);
})
$('body').on('mouseleave', '.clone', function(){
  rm = setTimeout(function(){ $('.clone').remove(); },500);
}).on('mouseover', '.clone', function(){
  clearTimeout(rm);
});
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div id="m1">
KEK KEK KEK KEK KEK
</div>
<div id="m2">
AZAZA AZAZA AZAZA AZAZA AZAZA
<span class="link">m1</span>
</div>
<div id="m3">
OLOLO OLOLO OLOLO OLOLO OLOLO
<span class="link">m2</span>
</div>
<div id="m4">
PIHSCH PIHSCH PIHSCH PIHSCH PIHSCH
<span class="link">m3</span>
</div>
1
0 / 0 / 0
Регистрация: 31.03.2017
Сообщений: 4
31.03.2017, 20:08  [ТС] 3
Уф, спасибо большое! Это задание дали на курсах, я не смог разобраться как именно лесенку из них сделать...
а именно как сослаться на предидущий коммент.
0
602 / 577 / 103
Регистрация: 16.07.2012
Сообщений: 1,762
31.03.2017, 20:46 4
это же не плагин
0
0 / 0 / 0
Регистрация: 31.03.2017
Сообщений: 4
31.03.2017, 22:04  [ТС] 5
alpex, я этот код оберну в плагин
0
886 / 721 / 447
Регистрация: 13.07.2015
Сообщений: 2,241
31.03.2017, 22:50 6
z-index можно сбрасывать на 1 при каждом наведении на оригинальный пост, она только в клонах расти должна, а то ща у меня бесконечно растет
0
0 / 0 / 0
Регистрация: 31.03.2017
Сообщений: 4
01.04.2017, 09:35  [ТС] 7
Уф, Уф, попробовал обернуть код в оболчку для плагина
//(function($){
// $.fn.AnswerView = function() {
тут код
}
})(JQuery)

Не хочет работать, не подскажешь почему???
0
886 / 721 / 447
Регистрация: 13.07.2015
Сообщений: 2,241
03.04.2017, 07:19 8
ты его просто воткнул и все? внутри плагина код должен ссылаться на переменную this, тогда будет работать

Добавлено через 4 минуты
а еще у тебя первые две строки закомментированы
Простейший плагин:
Javascript
1
2
3
4
5
$.fn.hello = function() {
    this.css('background','#0f0');
    this.who = function(){ return this.attr('id'); }
    return this;
}
При инициализации раскрашивает блок в зеленый цвет, и добавляет функцию определения айди
Javascript
1
2
var test = $('#block').hello();
alert ( test.who() );
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
03.04.2017, 07:19

Заказываю контрольные, курсовые, дипломные и любые другие студенческие работы здесь.

Плагин и jQuery
Доброго времени, граждане) В общем проблема такая: Нужно привинтить на сайт вот такой плагин:...

подскажите как правильно сделать запись в бд из дерева плагин jstree
Недавно заинтересовался плагином jstree. меня там очень заинтересовало редактирование дерева онлайн...

Подскажите как передать var в jquery
id нескольких элементов вычисляется благодаря формулам типа: var a = &quot;text&quot; + &quot;number&quot;; Но jquery...

jQuery- подскажите как доделать меню
Добрый день пытаюсь создать меню со всплывающими вкладками. Подскажите пожалуйста какую функцию...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
8
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.