Как сделать Pop-up в Tampermonkey?

Question

[Rostyk Ice]

Помогите, как сделать правильно Pop-up в Tampermonkey, я новенький в этом и незнаю.
Есть код кнопки, как сделать чтобы Pop-up открывался нажимая на нее, ну и как сделать сам Pop-up ?

$('body').append('<input type="button" accesskey="q" accesskey="й" value="Н" id="btn" style="border-width: 0px; background: url(images/opacity.png);">')
  $("#btn").css("position", "absolute").css("top", 539).css("left", 350).css({ color: "red" });

Answer 1

[Alexander]

Что должен делать поп-ап? Просто спрашивать 1 строку текста или ещё что-то отображать. Всё это можно сделать множеством методов, конкретного "правильного" нет.

Comments

[Rostyk Ice]

Нужно поместить туда код:

$('body').append('<input type="text" name="in" id="in" size="4" placeholder="url" style="border-width: 0px; background: url(images/opacity.png);" >')
$("#in").css("position", "absolute").css("top", 329).css("left", 0).css({ color: "red" });

$('body').append('<input type="text" name="in1" id="in1" size="4" placeholder="rez" style="border-width: 0px; background: url(images/opacity.png);" >')
$("#in1").css("position", "absolute").css("top", 349).css("left", 0).css({ color: "red" });

$('#in').change(function () {
  var template = '<p style="font-size: 11.9999990463257px;">';
  template += '<p><a href="'+$('#in').val()+'" target="_blank"><img alt="" src="'+$('#in').val()+'" style="width: 400px; height: 200px;" /></a></p>';
  $('#aut2').val(template);
});



$('body').append('<input type="text" name="aut" id="aut" size="40" placeholder="url" style="border-width: 0px; background: url(images/opacity.png);" >')
$("#aut").css("position", "absolute").css("top", 129).css("left", 234).css({ color: "red" });

$('body').append('<input type="text" name="aut1" id="aut1" size="40" placeholder="name" style="border-width: 0px; background: url(images/opacity.png);" >')
$("#aut1").css("position", "absolute").css("top", 149).css("left", 234).css({ color: "red" });

$('body').append('<textarea type="textarea" name="aut2" id="aut2" cols="90" rows="10" placeholder="all" style="border-width: 0px; background: url(images/opacity.png);" MULTIPLE>')
$("#aut2").css("position", "absolute").css("top", 119).css("left", 494).css({ color: "red" });

$('#aut, #aut1').change(function () {
  var template = '<td>';
  template += '<p><a href="'+$('#aut').val()+'" target="_blank"><img alt="" src="'+$('#aut').val()+'" style="width: 200px; height: 105px;" /></a></p>';
  template += '<p>&nbsp;</p>';
  template += '<p>'+$('#aut1').val()+'</p>';
  template += '</td>';

  $('#aut2').val(template);

[Alexander]

Rostyk Ice: Тогда либо пишешь свой "костыль", либо используешь вроде такого - jqueryui.com/dialog/#modal-form

[Rostyk Ice]

Alexander: Спасибо, но примеров уже много искал, но как сделать в Tampermonkey незнаю.