1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69
| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Test - Text Alignement IE9</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<style>
.align-left
{
text-align: left;
}
.align-center
{
text-align: center;
}
.align-right
{
text-align: right;
}
</style>
</head>
<body>
<div>
<fieldset>
<legend>CSS</legend>
<label>text-align: left: <input type="text" class="align-left" value="essai"></label><br />
<label>text-align: center: <input type="text" class="align-center" value="essai"></label><br />
<label>text-align: right: <input type="text" class="align-right" value="essai"></label><br />
</fieldset>
<fieldset>
<legend>STYLE ELEMENT</legend>
<label>text-align: left: <input type="text" style="text-align: left;" value="essai"></label><br />
<label>text-align: center: <input type="text" style="text-align: center;" value="essai"></label><br />
<label>text-align: right: <input type="text" style="text-align: right;" value="essai"></label><br />
</fieldset>
<fieldset>
<legend>jQuery</legend>
<label>text-align: left: <input type="text" class="left" value="essai"></label><br />
<label>text-align: center: <input type="text" class="center" value="essai"></label><br />
<label>text-align: right: <input type="text" class="right" value="essai"></label><br />
</fieldset>
<script>
$(document).ready(function ()
{
$('.left').change(function ()
{
align(this, 'left');
});
$('.left').css('text-align', 'left');
$('.center').change(function ()
{
align(this, 'center');
});
$('.center').css('text-align', 'center');
$('.right').change(function ()
{
align(this, 'right');
});
$('.right').css('text-align', 'right');
});
function align(element, alignement)
{
$(element).css('text-align', alignement);
}
</script>
</div>
</body>
</html> |
Partager