- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to show image in alert box using JavaScript?
To show an image in alert box, try to run the following code. Here, an alert image is added to the custom alert box −
Example
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
<script>
function functionAlert(msg, myYes) {
var confirmBox = $("#confirm");
confirmBox.find(".message").text(msg);
confirmBox.find(".yes").unbind().click(function() {
confirmBox.hide();
});
confirmBox.find(".yes").click(myYes);
confirmBox.show();
}
</script>
<style>
#confirm {
display: none;
background-color: #FFFFFF;
border: 1px solid #aaa;
position: fixed;
width: 250px;
left: 50%;
margin-left: -100px;
padding: 6px 8px 8px;
box-sizing: border-box;
text-align: center;
}
#confirm button {
background-color: #48E5DA;
display: inline-block;
border-radius: 5px;
border: 1px solid #aaa;
padding: 5px;
text-align: center;
width: 80px;
cursor: pointer;
}
#confirm .message {
text-align: left;
}
</style>
</head>
<body>
<div id="confirm">
<div class="message">This is a warning message.</div>
<button class="yes">OK</button>
<img src = "https://encrypted-tbn0.gstatic.com/images?q=
tbn:ANd9GcSNjyHBjM74KLxvROpx34zsT4zPzMWHMHz4zzJwAtemXGglsjtA"
width="120" height="70"/>
</div>
<input type="button" value="Click Me" onclick="functionAlert();" />
</body>
</html>
Updated on 16-Jun-2020 13:14:55
- Related Questions & Answers
- How do I display image in alert/confirm box in JavaScript?
- How to design a custom alert box using JavaScript?
- How to show hyperlinks in JavaScript alert?
- How to show prompt dialog box using JavaScript?
- How to change button label in alert box using JavaScript?
- How I can show JavaScript alert box in the middle of the screen?
- How to center the JavaScript alert message box?
- How to edit a JavaScript alert box title?
- How to customize the position of an alert box using JavaScript?
- How to call JavaScript function in an alert box?
- How to display JavaScript variable value in alert box?
- How to provide new line in JavaScript alert box?
- How I can change the style of alert box using JavaScript?
- What is an alert box in JavaScript?
- How to create and apply CSS to JavaScript Alert box?
Advertisements