Pages

Popup Ads on Blogger Website in JavaScript Code

How to show Popup Ads on Your Website

JavaScript provides various popup boxes to notify, alert, or receive input from a user. Pop-ups prevent the user from accessing other features of the system until they pop up automatically, so they should not be overused.

There are three different types of emerging methods used in JavaScript.
  • Notification box
  • Confirm the box
  • Inbox

JavaScript Notification Box:-

A warning dialog box is used to notify or alert the user by displaying more messages in a small chat box. The following is its syntax:
JavaScript Verify Box
A verification box is used to allow the user to select. When Javascript opens the verification box, the user will have to click "OK" or "Cancel" to proceed to the next step.
Also, based on user clicks we can perform various actions. We can explain this course of action in a conditional sense.

JavaScript Prompt Box:-

Javascript Prompt Box can be used when searching for user input. When Javascript displays a dialog box, the user will see a popup box with the input field and the "OK" or "Cancel" buttons to continue after entering the input value.
The following is the syntax for the JavaScript Prompt box:
Here, ANOTHER MESSAGE is the message displayed in the popup box, and DEFAULT_VALUE is the default value in the input field. Default value is a field of choice.

The value returned by the command depends on what the user does with the box.

Use Pop Up Boxes Use:-

Now that we know about three pop-up boxes that we can build and use in JavaScript, let's combine a few uses where we can use them.

The JavaScript alert box can be used to show any error message or any help message. For example, if you perform a form field verification, and you find a certain field value is incorrect, you can display an alert box with a user notification message for incorrect entry.

JavaScript Verify the box is a good way to verify any important user action such as if we have a feature in our web system when we click a button, we make an AJAX call to the server to delete certain data from the database, in which case, you should confirm once the button is clicked to give the user a second chance to confirm or cancel a request if it was made in error. Therefore, for important actions, we should use a check box that confirms.

The JavaScript Prompt box can be used to create a program-like menu where based on user input various actions performed using the JavaScript conversion statement. Let's take the example of a simple code to show this:
In this tutorial we covered JavaScript popup boxes such as a warning box, a confirmation box and a prompt box. You can use them to make your app more responsive.

Past this code on your website <body> tag:-

<!-- popup ads start tag -->
<style>
    /* Popup box BEGIN */
    .hover_bkgr_fricc {
        cursorpointer;
        positionfixed;
        text-aligncenter;
        top30%;
        width100%;
        z-index10000;
    }

    .hover_bkgr_fricc .helper-for-ads {
        displayinline-block;
        height100%;
        vertical-alignmiddle;
    }

    .hover_bkgr_fricc>div {
        background-color#fff;
        box-shadow10px 10px 60px #555;
        displayinline-block;
        heightauto;
        max-width551px;
        min-height100px;
        vertical-alignmiddle;
        width60%;
        positionrelative;
        border-radius8px;
        padding15px 5%;
    }

    .popupCloseButton {
        background-color#fff;
        border3px solid #999;
        border-radius50px;
        cursorpointer;
        displayinline-block;
        font-familyarial;
        font-weightbold;
        positionabsolute;
        top-20px;
        right-20px;
        font-size25px;
        line-height30px;
        width30px;
        height30px;
        text-aligncenter;
    }

    .popupCloseButton:hover {
        background-color#ccc;
    }

    .trigger_popup_fricc {
        cursorpointer;
        font-size20px;
        margin20px;
        displayinline-block;
        font-weightbold;
    }

    /* Popup box BEGIN */
</style>
<div class='hover_bkgr_fricc' 
    id='fixedban' style='height: 100%;'>
<span class='helper-for-ads'></span>
<div>
<a class='popupCloseButton' id='close-fixedban' 
onclick='document.getElementById("fixedban").style.display = "none";' 
style='cursor:pointer; color: black;'>x</a>
<!-- Replace this Text and Past Your Google Ads Code -->
</div>
</div>
<script type='text/javascript'>
    $(document).ready(function () { $('img#closed').click(function () { 
$('#bl_banner').hide(90); }); });
</script>
<!-- popup ads end tag -->

0 Comments:

Post a Comment