Planet 付箋的なことを

Planet

[28] [27] [26] [25] [24] [23] [22] [21] [20] [19]

[PR]

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

2026/06/13 (Sat)

<!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="ja" lang="ja">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Untitled Document</title>
        <script type="text/javascript" src="yui/yahoo-dom-event/yahoo-dom-event.js"></script>
        <script type="text/javascript" src="yui/dragdrop/dragdrop-min.js"></script>
        <script type="text/javascript">
        //<![CDATA[
        YAHOO.util.Event.addListener(window, "load", loadFunc);
        YAHOO.util.Event.addListener(document, "dblclick", clickFunc);

        var panel_num = 0;
        var panels = [];
        var depth = 0;

        function loadFunc() {
            var dd1 = new YAHOO.util.DD("dd1");
            var target = new YAHOO.util.DDTarget("target");

            dd1.onDragDrop = function(event, id) {
                YAHOO.util.Dom.get("target").innerHTML += event + "," + id + "<br/>";
            }
            //dd1.setHandleElId("handle");
            // x方向への制限(0, 640)px step by 10px
            dd1.setXConstraint(0, 640, 10);
            dd1.setYConstraint(0, 480, 10);
        }

        function clickFunc() {
            if(panel_num >= 5) {
                alert("これ以上は作成できません");
                return;
            }
            var panel_name = "panel" + panel_num;
            var ele = document.createElement("div");
            ele.id = panel_name;
            YAHOO.util.Dom.addClass(ele,"memoWrapper");
            document.body.appendChild(ele);
            var eleh = document.createElement("div");
            eleh.id = "h" + panel_name;
            YAHOO.util.Dom.addClass(eleh,"handler");
            YAHOO.util.Dom.get(panel_name).appendChild(eleh);
            YAHOO.util.Dom.get("h" + panel_name).innerHTML = "Memo" + panel_num;
            var elet = document.createElement("textarea");
            YAHOO.util.Dom.get(panel_name).appendChild(elet);

            panels[panel_num] = new YAHOO.util.DD(panel_name);
            panels[panel_num].setHandleElId("h" + panel_name);

            var x = Math.random() * 640;
            var y = Math.random() * 480;
            YAHOO.util.Dom.setXY(panel_name, [x, y], true);


            panels[panel_num].startDrag = function() {
                YAHOO.util.Dom.setStyle(panel_name, "z-index", depth++);
            }

            depth = panel_num++;

        }
        //]]>
        </script>
        <style type="text/css">
            textarea {
                width: 180px;
                height: 9em;
                overflow: auto;
            }
            .memoWrapper {
                width: 190px;
                height: 11em;
                text-align: center;
                border: 1px solid #ddd;
            }
            .handler {
                height: 24px;
                color: #FFF;
                background: url(images/red.gif)
            }
        </style>
    </head>
    <body>

    </body>
</html>