Bug Tracker

Ticket #1342: fade.html

File fade.html, 1.8 KB (added by noahlazar, 16 years ago)

Another test case

Line 
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
2        "http://www.w3.org/TR/html4/strict.dtd">
3<html lang="en">
4<head>
5        <title>jQuery 1.1.3 IE Opacity Bug</title>
6
7        <!-- Use 1.1.3 packed or unpacked -->
8        <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
9
10        <script type="text/javascript">
11
12                $(document).ready(function(){
13
14                        $("#fadein").click(function(){
15
16                                $("#block").animate({ opacity: 'show' }, "slow");
17
18//                              Or use fadeIn() instead
19//                              $("#block").fadeIn("slow");
20
21                                return false;
22                        });
23
24
25                        $("#fadeout").click(function(){
26
27                                $("#block").animate({ opacity: 'hide' }, "slow");
28
29//                              Or use fadeOut() instead
30//                              $("#block").fadeOut("slow");
31
32                                return false;
33                        });
34
35                });
36        </script>
37</head>
38
39<body>
40
41
42<h1>jQuery 1.1.3 Opacity Bug</h1>
43
44<p>Animation with opacity changes <strong>fail</strong> in IE6 and IE7 with the new jQuery
451.1.3 release. The opacity style is not properly altered, just the display style at the
46end of the animation. This also affects <code>.fadeIn()</code> and
47<code>.fadeOut()</code>, which call the <code>.animate()</code> function.</p>
48
49
50<p><a href="#" id="fadeout">Fade Out</a></p>
51<p><a href="#" id="fadein">Fade In</a></p>
52
53
54<div id="block">
55
56        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla.</p>
57
58</div>
59
60
61</body>
62</html>