Home
About
Health
Join the Team!
Links
Blog
Services
Contact
Okay, well, it's not really HTML,
Just add \n wherever you want a newline . So, put two \n\n for two newlines, like a paragraph. You can also use \t for a tab character. View the source that creates the button below this line:
Check out this tutorial on escaping characters in a JavaScript alert .
To try an example:
Go to w3schools' try-it=yourself=editor for the JavaScript alert() function .
Then, copy and paste this code into the textarea: <html> <head> <script type="text/javascript"> function show_alert() { alert("Hello! I am an alert box!\n\nWith more than one paragraph. To make this alert box, read the tutorial from whence it came. You can also right-click to inspect elements on the page or to view the source of this page and reverse engineer it. Or, get Firefox and Firebug. It's sweet.\n\n\tHere's a tab-indented paragarph.\n\n Here's a paragraph indented with 4 spaces."); } </script> </head> <body> <input type="button" onclick="show_alert()" value="Show alert box" /> </body> </html>
<html> <head> <script type="text/javascript"> function show_alert() { alert("Hello! I am an alert box!\n\nWith more than one paragraph. To make this alert box, read the tutorial from whence it came. You can also right-click to inspect elements on the page or to view the source of this page and reverse engineer it. Or, get Firefox and Firebug. It's sweet.\n\n\tHere's a tab-indented paragarph.\n\n Here's a paragraph indented with 4 spaces."); } </script> </head> <body>
<input type="button" onclick="show_alert()" value="Show alert box" />
</body> </html>
Then, click the "Edit and Click Me >>" button at the top. After the page loads with the new html that you pasted, click the "Show alert box" button on the right.
Does it have two lines?
The real way to add HTML to your JavaScript alert box is... Well, I think you could just do it mainly with CSS.
Check out how Match.com does an alert box
Right-clicking and selecting "Inspect Element" in Google Chrome (or you can use Firefox's plugin Firebug), I gathered some ideas in how to do this.
Make a container div that covers the whole page, and give it the CSS {background-color:black; opacity: 0.3; display: none}
Make a div centered inside your container div for your alert message.
Use JavaScript or jQuery to change the display:none to display:block
MattDiPasquale's blog
Add new comment
Hi Matt,
Here is the code,
$(document).ready(function () {
// la funcion para pop
// if user clicked on button, the overlay layer or the dialogbox, close the dialog $('a.btn-ok, #dialog-overlay, #dialog-box').click(function () { $('#dialog-overlay, #dialog-box').hide(); return false; });
// if user resize the window, call the same function again // to make sure the overlay fills the screen and dialogbox aligned to center $(window).resize(function () {
//only do it if the dialog box is not hidden if (!$('#dialog-box').is(':hidden')) popup(); });
//Popup dialog function popup(message) {
// get the screen height and width var maskHeight = $(document).height(); var maskWidth = $(window).width();
// calculate the values for center alignment var dialogTop = (maskHeight/3) - ($('#dialog-box').height()); var dialogLeft = (maskWidth/2) - ($('#dialog-box').width()/2);
// assign values to the overlay and dialog box $('#dialog-overlay').css({height:maskHeight, width:maskWidth}).show(); $('#dialog-box').css({top:dialogTop, left:dialogLeft}).show();
// display the message $('#dialog-message').html(message);
HERE IS THE HTML
Lorem Ipsum de texto. Lorem Ipsum Lorem Ipsum es simplemen to integrate with any website throjust images, and it throjust images, and it gracefully deges si t
!!!!!!!!!!!THE TEXT IS INSIDE THE PARENTHESIS!!!!!!!!!!!!!
('Hi The Bartered Bride, were premiered at Prague's Provisional Theatre, the latter achieving great popularity. Factions within the city's musical establishment interfered with his creative work, and may have hastened his health breakdown. By 1874, Smetana had become completely deaf but, freed from his theatre duties and the related controversies, he began a period of sustained composition. His contributions to Czech music were increasingly recognised and honoured, but a mental collapse in 1884 led to his incarceration in an asylum, and his subsequent death. Smetana's reputation as the father of Czech music has endured')
WHEN YOU CLICK MORE...THE WINDOW POPS
LET ME KNOW IF YOU CAN FIGURE IT OUT
PAULA
reply
How to build web apps...
Getting started with Ruby on Rails
How to delete comment spam in Drupal 6
iPhone Application Development Tutorial & Guide
Handy MySQL Query to find all unique/different values of a column
How to add HTML to a JavaScript alert box
WriteRoom: The Matrix of Word Processors
Matt V. Git: Inspired by JW
acani: connect and play with nearby people who have similar interests
Instructions: How to Install Git from Source on Mac OS X 10.6 (Snow Leopard) Intel x86 (32 bit)