Pop-Up Message By Clicking On Button Widget For Blogger

You Might Have Seen On Many Websites And Blogs,Something Like a Popup Box or Message Being Displayed to the User,Whenever They Click on Specific Buttons Such as Download,Like...etc.it Displays Some Instruction to the User.So if You Want to Show Such type of Instruction or Message to Your Readers then you are at the Correct Place.Follow the Below Steps to Add this Effect.

USE...If you want to show the visitor a message when he or she clicks on a button or a link you would maybe want to try this code.

Pop-Up Message By Clicking On Button Widget For Blogger

• 
  
• Go to Blogger < Html Section <
• Now Copy & Paste Code Below Code Anywhere you Want.
• <style>
  /*--- Message To User By Click On Button By GIB --- */
  
  .btnLogin
  {
      -moz-border-radius:2px;
      -webkit-border-radius:2px;
      border-radius:15px;
      background:#a1d8f0;
      background:-moz-linear-gradient(top, #badff3, #7acbed);
      background:-webkit-gradient(linear, center top, center bottom, from(#badff3), to(#7acbed));
      -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#badff3', EndColorStr='#7acbed')";
      border:1px solid #7db0cc !important;
      cursor: pointer;
      padding:11px 16px;
      font:bold 11px/14px Verdana, Tahomma, Geneva;
      text-shadow:rgba(0,0,0,0.2) 0 1px 0px;
      color:#fff;
      -moz-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
      -webkit-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
      box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
      margin-center:12px;
      float:center;
      padding:7px 21px;
  }
  
  .btnLogin:hover,
  .btnLogin:focus,
  .btnLogin:active{
      background:#a1d8f0;
      background:-moz-linear-gradient(top, #7acbed, #badff3);
      background:-webkit-gradient(linear, center top, center bottom, from(#7acbed), to(#badff3));
      -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#7acbed', EndColorStr='#badff3')";
  }
  .btnLogin:active
  {
      text-shadow:rgba(0,0,0,0.3) 0 -1px 0px;
  }
  /*--- Message To User By Click On Button By GIB --- */
  </style>
  
  
  
  <!-- Start of Message Alert -->
  <!-- Use this button in a form to pop-up a message when the user clicks it -->
  <center>
  <form>
  <input type="button" value="Message" class="btnLogin" onClick="alert('Write Your Message Here'); return true">
  </form>
  </center>
  <!-- End of Message Alert -->
• Now Replace "Message" And "Write Your Message Here" With Your Own Message.