Menu
How to display image in alert box or confirm box? I have been trying with below code but getting image url in the alert box. Please anybody help me to get solve or please give any other suggestions if it does not possible.
var image = document.getElementById("myImage").src="hackanm.gif";
alert("OnLoad image"+image );
977
You can only alert text. If you want to display an image, you would have to make a fake alert, by creating a <div> element that is floated in front of the page and has a link to make it disappear. If you wanted to go further, you could use mousedown, mousemove and mouseup events to let the <div> be draggable.
The standard alert box in JavaScript does not provide the option to apply CSS. To style your alert box, you need to create a custom one first. The custom alert box will be created using jQuery and styles will be applied to CSS.
//with this first line we're saying: "when the page loads (document is ready) run the following script" $(document). ready(function () { //select the POPUP FRAME and show it $("#popup"). hide(). fadeIn(1000); //close the POPUP if the button with id="close" is clicked $("#close").
Alert boxes in JavaScript can only display pure text. You could use a JavaScript library like jQuery to display a modal instead?
This might be useful: http://jqueryui.com/dialog/
You can do it like this:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Dialog - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
body {
font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif";
font-size: 62.5%;
}
</script>
<script>
$(function() {
$( "#dialog" ).dialog();
});
</script>
</head>
<body>
<div id="dialog" title="Basic dialog">
<p>Image:</p>
<img src="http://placehold.it/50x50" alt="Placeholder Image" />
</div>
</body>
</html>
Snarky yet potentially useful answer:
http://picascii.com/ (currently down)
https://www.ascii-art-generator.org/es.html (don't forget to put a \n after each line!)
37
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
