Пользовательское диалоговое окно HTML / JavaScript - PullRequest
Новая
       7

Пользовательское диалоговое окно HTML / JavaScript

0 голосов
/ 02 июля 2018

Я довольно новичок в веб-разработке и работаю над личным проектом. В рамках проекта я пытаюсь научиться создавать собственные диалоги и, где возможно, использовать существующие библиотеки для достижения того, чего я хочу.

Я наткнулся на alert, который в значительной степени охватывает типы диалоговых окон, которые я хочу, но есть один, который я не могу понять, как создать. Диалоговое окно содержит значки, и я не уверен, как мне этого добиться. Я предоставил скриншот того, чего я хотел бы достичь вместе с тем, что я сделал до сих пор.

[! [Введите описание изображения здесь] [1]] [1] 

if(!alertify.myAlert){
        //define a new dialog
        alertify.dialog('myAlert',function factory(){
          return{
            main:function(message){
              this.message = message;
              this.body = '<h1> test <h1>'
            },
            setup:function(){
                return { 
                  buttons:[{text: "Close", key:27/*Esc*/}],
                  focus: { element:0 }
                };
            },
            prepare:function(){
              this.setContent(this.message);
              this.body = '<h1> test <h1>'
            }
        }});
      }
      //launch it.
      alertify.myAlert("Type in your message below and choose how you would like to share!");

Я использовал это руководство - https://alertifyjs.com/factory.html для создания вышеуказанного диалогового окна.

Если невозможно создать то, что я хочу, с помощью alerttifyJS, не могли бы вы предложить альтернативные способы. Я хотел бы, где это возможно, избегать использования HTML для создания собственного диалога - если только это не является абсолютно неизбежным. Если это можно сделать с помощью alerttifyJS, я бы предпочел, чтобы:)

...