Kullanıcı:Mustafa MVC/quickabdest.js

Not: Yayımladıktan sonra değişiklikleri görmek için tarayıcınızın önbelleğini temizlemeniz gerekebilir.

Firefox / Safari: Shift tuşuna basılıyken Yeniden Yükle'ye tıklayın ya da Ctrl-F5 ya da Ctrl-R tıklayın (Mac için ⌘-R).
Google Chrome: Ctrl-Shift-R'ye basın. (Mac için ⌘-Shift-R)
Internet Explorer / Edge: Ctrl basılıyken Yenile'ye tıklayın ya da Ctrl-F5 yapın.
Opera: Ctrl-F5 tıklayın.

//Bu kod daha gelişmiş ve değişiklik yapmaya yardımcı olacak eklentilerin geliştirilmesi için temel bir testtir.

/* Popup oluşturmak için gerekli HTML kodu */
var popupHtml = '<div id="myPopup" style="display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: white; border: 1px solid black; width: 300px; height: auto; padding: 10px; text-align: center;"> \
                     <img id="popupImage" src="https://quickabdest.com/style/files/feelsbad.png" style="max-width: 100%; height: auto;"> \
                     <div id="popupText" style="margin-top: 10px; font-weight: bold;">Tıkla abdest al</div> \
                 </div>';

/* Popup HTML kodunu sayfaya ekleyelim */
$('body').append(popupHtml);

/* Butonu oluşturalım ve sayfaya ekleyelim */
var buttonHtml = '<button id="openPopupButton">Quick Abdest</button>';
$('body').append(buttonHtml);

/* Butonu ekranın sağ altında konumlandıralım */
$('#openPopupButton').css({
    'position': 'fixed',
    'bottom': '0',
    'right': '0'
});

/* Butona tıklandığında popup'u açalım / kapatalım */
$('#openPopupButton').click(function() {
    if ($('#myPopup').is(':visible')) {
        $('#myPopup').hide();
    } else {
        $('#myPopup').show();
    }
});

/* Resme tıklandığında resmi ve yazıyı değiştirelim */
$('#popupImage').click(function() {
    $('#popupImage').attr('src', 'https://quickabdest.com/style/files/feels.png');
    $('#popupText').html('Abdestlendin');
});