Добавьте переменную длительности задержки во всплывающий Javascript

Вы должны будете отказаться от setInterval, поскольку очевидно, что это приводит к интервалам одинаковой продолжительности. Вместо этого используйте setTimeout и оберните его в функцию, которую вы вызываете снова через вложенную setTimeout.

Вот как будет заменена часть setInterval вашего кода:

var startInterval;
var i = 0;
(function loop() {
    $("#popup >p").text(messages_array[i].Message);
    i = (i + 1) % messages_array.length; // next index ...
    $("#close").css("display", "block");
    $("#popup").show();
    startInterval = setTimeout(function() {
        $("#popup>p").text('');
        $("#popup").hide();
        startInterval = setTimeout(loop, duration * (Math.random() * 1.5 + 0.5));
    }, showDuration);
})();

Фактическая пауза между всплывающими окнами теперь установлена ​​на случайную продолжительность между duration/2 и duration*2. Таким образом, вы все еще можете влиять на это.

Что касается остальной части вашего кода: старайтесь избегать применения встроенных стилей. Вместо этого определите классы CSS и назначьте их.

Примечание: как уже упоминалось в комментариях, порядок сообщений больше не является случайным.