| 123456789101112131415161718192021222324252627282930313233343536373839404142 |
- <!doctype html>
- <html>
- <head>
- <title>Holder Detached DOM Testing</title>
- <meta charset="utf-8">
- <style>
- body {background: #fff; font-family:Arial,sans-serif;margin:0 auto;min-width:1080px}
- .thumb {width:300px;height:250px;margin:25px;float:left}
- .thumb img, .thumb .holderjs, .thumb object {display:block;margin:0 auto}
- .thumb .caption {padding:10px;text-align:center;margin-top:10px}
- button {clear: both;display:block;margin:10px;font-size:1.2em;}
- </style>
- <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
- <script src="../holder.js"></script>
- <script>
- Holder.run();
- $(function () {
- var cloneThumb = $('.thumb:first').clone();
- Holder.run();
- $("#replaceBtn").on('click', function (e) {
- $('body').remove();
- var newBody = $('<body />');
- newBody.append(cloneThumb);
- newBody.appendTo($('html'));
- Holder.run();
- });
- });
- </script>
- </head>
- <body>
- <button id="replaceBtn">Replace body</button>
- <div class="thumb">
- <img data-src="holder.js/300x200">
- <div class="caption">
- Plain placeholder
- </div>
- </div>
- </body>
- </html>
|
