diff options
Diffstat (limited to 'emacs.d/nxhtml/tests/in/kubica-080516-freezing-2.html')
-rw-r--r-- | emacs.d/nxhtml/tests/in/kubica-080516-freezing-2.html | 174 |
1 files changed, 174 insertions, 0 deletions
diff --git a/emacs.d/nxhtml/tests/in/kubica-080516-freezing-2.html b/emacs.d/nxhtml/tests/in/kubica-080516-freezing-2.html new file mode 100644 index 0000000..8203f63 --- /dev/null +++ b/emacs.d/nxhtml/tests/in/kubica-080516-freezing-2.html @@ -0,0 +1,174 @@ +{% load transdigest helpers %} +<?xml version="1.0" encoding="UTF-8"?> +<!DOCTYPE html PUBLIC + "-//W3C//DTD XHTML 1.0 Transitional//EN" + "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> + <head profile="http://dublincore.org/documents/dcq-html/"> + <link rel="schema.DC" href="http://purl.org/dc/elements/1.1/" /> + <link rel="schema.DCTERMS" href="http://purl.org/dc/terms/" /> + <link rel="stylesheet" type="text/css" href="{% media_url %}/homepage/css/web0.5.css" media="screen" /> + + <title>{% block title %}{% translate "WELCOME_TO_POINTTEC" %}{% endblock %}</title> + <meta name="DC.title" content="Homepage of point TEC" /> + <meta name="DC.creator" content="Marek Kubica" /> + <meta name="DC.subject" content="Presentation of products" /> + <meta name="DC.publisher" content="point TEC" /> + <meta name="DC.rights" content="copyright by point TEC" /> + {% block htmlhead %} + + {% endblock %} + <style type="text/css"> + { % block pagestyle % } + * { + margin: 0; + padding: 0; + } + img { + border: 0 + } + + html, body { + height: 100%; + } + + #distance { + width: 1px; + height: 50%; + margin-bottom: -175px; + } + #container { + position: relative; + margin: 0 auto; + height: 370px; + width: 500px; + background-color: #ffffff; + } + /* the horizontal bars */ + #flashcontent * div { + background-color: #292926; + } + + #pointer { + display: block; + margin: 0 auto; + } + + { % endblock % } + </style> + <script type="text/javascript" src="{% media_url %}/homepage/js/jquery.js"></script> + <script type="text/javascript" src="{% media_url %}/homepage/js/jquery.preload.js"></script> + <script type="text/javascript" src="{% media_url %}/homepage/js/swfobject.js"></script> + <script type="text/javascript"> + function image_loaded(info) { + /* now we know that the image is loaded, we can add in to the + * document and position it as we want */ + // create the element, set the ID and add in to the DOM, + // otherwise it won't have dimensions + var pointer = $('<img src="' + info.image + '" />'); + pointer.attr('id', 'pointer'); + var frame = $('#container'); + pointer.appendTo(frame); + + // put it into the center and make top & left be in the center + // of the image (cool hack) + pointer.css({ + position: 'absolute', + top: '50%', + left: '50%', + margin: (-pointer.height() / 2) + 'px 0 0 ' + + (-pointer.width() / 2) + 'px' + }); + + // continue with the animation now + play_animation(); + } + + function prepare_animation() { + /* prepares animation by preloading stuff */ + // hide all panels + $('a > img').css('visibility', 'hidden'); + // create the logo - 'pointer': preload and center it + $.preload(['logo'], { + base: '{ % media_url % }/homepage/img/intro/', + ext: '.png', + onFinish: image_loaded + }); + } + + function play_animation() { + /* plays the animations, adds callbacks */ + var frame = $('#container'); + var pointer = $('#pointer'); + + /* run the effects now: first fade in the pointer, then move it + * to the edge of the frame, then fade in the panels + */ + pointer.hide().fadeIn(2000) + .animate({ + top: pointer.height() / 2 + 10, + left: frame.width() - pointer.width() / 2 + }, 3000, undefined, function() { + var panels = $('a > img'); + // show panels, fade them in and add callbacks + panels.css({ visibility: 'visible', + opacity: '0'}) + .fadeTo(1000, 0.5) + .mouseover(fade_in) + .mouseout(fade_out); + }); + } + + function fade_in() { + /* fade in the panel */ + $(this).fadeTo(300, 1); + } + + function fade_out() { + /* fade out the panel */ + $(this).fadeTo(300, 0.5); + } + + // start JS magic when the page has loaded + $(document).ready(prepare_animation); + </script> + + </head> + +{% block body %} +<body> + +<div id="distance"></div> +<div id="container"> + <div id="flashcontent"> + + <table border="0"> + <tr> + <td colspan="3"><div style="height: 63px;" /></td> + </tr> + <tr> + <td><a href="/junkers/"><img src="{% media_url %}/homepage/img/intro/panel_junkers.jpg" alt="junkers" width="166" height="221" /></a></td> + <td><a href="/zeppelin/"><img src="{% media_url %}/homepage/img/intro/panel_zeppelin.jpg" alt="zeppelin" width="168" height="221" /></a></td> + <td><a href="/maximilian/"><img src="{% media_url %}/homepage/img/intro/panel_maximilian.jpg" alt="maximilian" width="162" height="221" /></a></td> + </tr> + <tr> + <td colspan="3"><div style="height: 66px;" /></td> + </tr> + </table> + </div> + + <script type="text/javascript"> + // <![CDATA[ + var so = new SWFObject("{% media_url % }/homepage/swf/intro_{ % translate "LANGUAGE_NAME" % }.swf", "intro", "500", "370", "9", "#FFF"); + so.addParam("allowScriptAccess", "always"); + so.write("flashcontent"); + // ]]> + </script> + +</div> +</div> + +</body> +{% endblock %} + +</html> |