📜 ⬆️ ⬇️

Modalbox - create dialog boxes

modal

Modalbox is a library for prototype and script.aculo.us for creating dialog boxes and wizards, the volume of its code is only 10kb. In my opinion this is a real attribute of the web two nolnost.


Modalbox works in IE6, IE7, Firefox 1.0, 1.5, 2.0, Safari, Camino, Opera 8 and 9.
')
This is what the wizard created with modalbox window looks like:

demomodalbox

Installation


  1. Download ModalBox and unpack it into a folder, for example in / includes (you should already have prototype + script.aculo.us libraries, as they are needed for Modalbox to work.)
  2. Connect all the necessary libraries by inserting the code below between the head tags:
      <script type = "text / javascript" src = "includes / prototype.js"> </ script>
     <script type = "text / javascript" src = "includes / scriptaculous.js? ¬
         load = effects "> </ script>
     <script type = "text / javascript" src = "includes / modalbox.js"> </ script> 

  3. Include the CSS design file - “modalbox.css”, also inserting code between the head tags:
      <link rel = "stylesheet" href = "includes / modalbox.css" type = "text / css"
     media = "screen" /> 


Usage example


  <a href = "frame_send-link.html" title = "Simple form" onclick = "
 <strong> Modalbox.show (this.href, {title: this.title, width: 600});  return false; </ strong>
 "> Send link to a friend </a> 

This example will open the frame_send-link.html page as a 600px modalbox block without reloading the page.

Download the ModalBox Library

See a bunch of "live" examples


Source: Chernev.Ru - Positive Blog

Source: https://habr.com/ru/post/22510/


All Articles