我有一个包含 HTML、JavaScript 和 CSS 的 JSFiddle。有没有一种简单的方法可以将它实现到 Dreamweaver 页面中？

Question

我几乎在网上到处都看过，自己也做了很多试验，但似乎无法在 Dreamweaver 中获得与 JSFiddle result 中相同的结果。

是否有一种相对简单的方法来制作与 JSFiddle 结果相同的网站网页（以及如何做到这一点）？

Answer 1

我认为你的问题是 jsFiddle 隐藏了代码工作所需的某些东西，在这种情况下最重要的是对 jquery 的引用，jsfiddle 会为你把它放在场景，但如果您将代码从 jsfiddle 中取出并且不像我那样引用 jquery，那么该代码将毫无用处。 css 周围的 <style> 标签之类的东西虽然在 jsfiddle 中不需要，但在将代码粘贴到 Dreamweaver 之类的东西时需要。

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <style>
            body {
                margin: 0;
                padding: 0;
            }
            #turtle img {
                display: block;
                margin: 0 auto;
            }
        </style>
        <script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
        <script>
            $(function () {
                var img = $('#turtle').html();
                for (var i = 0; i < 10; i++) {
                    more(img);
                }
                $(window).on('scroll', function () {
                    if ($(this).scrollTop() >= $('#turtle').height() - $(this).height()) {
                        more(img);
                    }
                });

                function more(content) {
                    $('#turtle').append(content);
                }
            });
        </script>
    </head>
    <body>
        <div id="turtle">
            <img src="http://upload.wikimedia.org/wikipedia/en/9/9b/Rickastleyposter.jpg" alt="infinity-turtle" />
        </div>
    </body>
</html>

我有一个包含 HTML、JavaScript 和 CSS 的 JSFiddle。有没有一种简单的方法可以将它实现到 Dreamweaver 页面中？

I have a JSFiddle that includes HTML, JavaScript, and CSS. Is there a simple way to implement it into a Dreamweaver page?

html

javascript

css

dreamweaver

jsfiddle