rxjs拖动dom元素示例代码-html代码-BFW代码库

rxjs拖动dom元素示例代码

代码语言：html

所属分类：拖放

代码描述：rxjs拖动dom元素示例代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">


    <style>
        table {
            padding: 14px;
        }

        #concat-table {
            float: left
        }
    </style>
    <style>
        .box {
            position: relative;
            width: 150px;
            height: 150px;
            background: green;
            cursor: pointer;
            color: white;
        }
    </style>


</head>

<body>
    <h1>Hello, Rx.js!</h1>


    <div class="box">
        按住拖动
    </div>
    <table id="concat-table">
        <thead>
            <tr>
                <td>
                    <b>Concatenated Stream</b>
                </td>
            </tr>
        </thead>
        <tbody id="concat-table-body">
        </tbody>
    </table>

    <table id="merge-table">
        <thead>
            <tr>
                <td>
                    <b>Merged Stream</b>
                </td>
            </tr>
        </thead>
        <tbody id="merge-table-body">
        </tbody>
    </table>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/rx.4.0.1.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.2.11.js"></script>
    <script>
        'use strict';

        const source1 =
        Rx.Observable.interval(100).
        map(val => `Source 1: ${val}`).
        take(5);

        const source2 =
        Rx.Observable.interval(100).
        map(val => `Source 2: ${val * 10}`).
      .........完整代码请登录后点击上方下载按钮下载查看