Created
June 27, 2012 13:15
-
-
Save obadiola/3004001 to your computer and use it in GitHub Desktop.
Small example to use the Bootstrap Alerts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- ============================================= | |
-- Author: Oscar Badiola | |
-- Create date: 06/08/2012 09:44:53 | |
-- Description: Small example to use the Bootstrap Alerts | |
-- ============================================= --> | |
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<title>Bootstrap Alert Demo</title> | |
<script src="jquery.js"></script> | |
<link href="bootstrap.css" rel="stylesheet"> | |
<script src="bootstrap-button.js"></script> | |
<script type="text/javascript" charset="utf-8"> | |
$(document).ready(function() { | |
$("#alert").hide(); | |
$("#setAlert").click(function() { | |
$("#alert").removeClass("alert-error alert-success alert-info").hide(); | |
$("#alert").addClass("alert").fadeIn(); | |
}); | |
$("#setAlertInfo").click(function() { | |
$("#alert").removeClass("alert-error alert-success alert-info").hide(); | |
$("#alert").addClass("alert alert-info").fadeIn(); | |
}); | |
$("#setAlertSuccess").click(function() { | |
$("#alert").removeClass("alert-error alert-success alert-info").hide(); | |
$("#alert").addClass("alert alert-success").fadeIn(); | |
}); | |
$("#setAlertError").click(function() { | |
$("#alert").removeClass("alert-error alert-success alert-info").hide(); | |
$("#alert").addClass("alert alert-error").fadeIn(); | |
}); | |
}); | |
</script> | |
<style type="text/css"> | |
div { | |
margin :5px auto 0px auto; | |
width:90%; | |
} | |
</style> | |
</head> | |
<body> | |
<a id="setAlert" href="#">Alert</a><br/> | |
<a id="setAlertInfo" href="#">Alert Info</a><br/> | |
<a id="setAlertSuccess" href="#">Alert Success</a><br/> | |
<a id="setAlertError" href="#">Alert Error</a><br/> | |
<div id="alert">Hello world.</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment