<style>

    *{ margin: 0; padding: 0;}

    #ul1{

        width: 400px;

        height: 400px;

        border: 1px solid #000;

        margin: 10px auto;

        padding: 4px;

        overflow: hidden;

    }

    /* #ul li 选择器写错了！！！ */  

    #ul1 li{

        border-bottom: 1px #999 dashed;

        padding: 4px;

        list-style: none;

        overflow: hidden;

        filter:alpha(opacity=0);

        opacity: 0;

        /* border-bottom: 1px dashed;  border没有设置颜色！！！ */

        /* filter: alpha = 0; 格式错误！！ */

    }

    </style>

    <script src="move2.js"></script>

    <script>

    window.onload = function()

    {

        var oTxt = document.getElementById('txt1');

        var oBtn = document.getElementById('btn1');

        var oUl = document.getElementById('ul1');

        oBtn.onclick = function()

        {

            var oLi = document.createElement('li');

            oLi.innerHTML = oTxt.value;

            oTxt.value = '';

            if(oUl.children.length>0)

            {

                // oUl.insertBefore(oLi, oUl.childNodes[0])

                // 注意childNodes 和 children的区别

                oUl.insertBefore(oLi, oUl.children[0]);

            }

            else

            {

                oUl.appendChild(oLi); // 添加的子节点值是不是这样写的？

            };

            var iHeight = oLi.offsetHeight;

            oLi.style.height = '0';

            startMove(oLi, {height: iHeight}, function()

            {

                startMove(oLi, {opacity: 100})

            });

        };

    };

    </script>

</head>

<body>

<textarea id="txt1" cols="30" rows="4"></textarea>

<input type="button" value="发布" id="btn1">

<ul id="ul1"></ul>

</body>

JS错误记录 - 微博发布的更多相关文章

  1. 点滴积累【JS】---JS小功能（JS实现模仿微博发布效果)

    效果: 思路: 利用多功能浮动运动框架实现微博效果,首先,将textarea中的属性添加到新创建的li里面然后,再将li添加到ul里面,再利用浮动运动框架将数据动态的显示出来. 代码: <hea ...

  2. JS错误记录 - 右侧悬浮框 - 缓冲运动

    本次练习错误总结: 1.  正确: startMove( document.documentElement.clientHeight - oDiv.offsetHeight + scrollTop); ...

  3. JS错误记录 - dom操作 - 排序

    本次练习错误总结: 1. for循环要套到按钮的onclick里面,否则onclick点击事件无法依次执行. 2. var n1, var n2 这两个变量是arr.sort排序使用的,所以应该放在s ...

  4. JS错误记录 - 事件 - 拖拽

    错误总结: 1. var disX = 0;   现在window.onload里声明变量,而不是在事件oDiv.onmousedown里面声明并赋值. 对于这个还不是很明白. 2. onmoused ...

  5. JS错误记录 - 按左右箭头div移动、一串div跟着鼠标移动

    本次练习错误总结: 1. div跟着用户操作而移动,首先必须要绝对定位,否则无法移动. 2. if条件语句里面是双等号,不是单等号(赋值). 3. 坐标值没有Right,只能offsetLeft 加减 ...

  6. JS错误记录 - getStyle代替offset、任意值运动框

    本次练习错误总结: 1. 改变border的宽度,属性名称不是直接写border,而是borderWidth. 2. 运动函数 -- 清除定时器 -- 开启新的定时器.  不是在新定时器开启之后再清除 ...

  7. JS错误记录 - To-do List

    var data = (localStorage.getItem('todolist'))? JSON.parse(localStorage.getItem('todolist')) : { todo ...

  8. JS错误记录 - fgm练习 - 函数传参

    <script> window.onload = function() { var oBtn = document.getElementsByTagName('button')[0]; v ...

  9. JS学习笔记 - 微博发布效果

    <script> window.onload = function() { var oTxt = document.getElementById('txt1'); var oBtn = d ...

随机推荐

  1. python + eclipse + django + postgresql 开发网站（一）

    一.配置开发环境 1.安装Python 载地址下:http://www.python.org/getit/

  2. HDU 2883 kebab

    kebab Time Limit: 1000ms Memory Limit: 32768KB This problem will be judged on HDU. Original ID: 2883 ...

  3. ArcGIS Engine能够做什么？

    转自原文ArcGIS Engine能够做什么? ArcGIS Engine是一组跨平台的嵌入式ArcObjects,它是ArcGIS软件产品的底层组件,用来构建定制的GIS和桌面制图应用程序,或是向原 ...

  4. JavaScript定时调用函数(SetInterval与setTimeout)

    setTimeout和setInterval的语法同样.它们都有两个參数.一个是将要运行的代码字符串.另一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将运行那段代码. 只是这两个函数还是有差别的 ...

  5. 【Android实战】Bitmap图片的截屏、模糊处理、传递、使用

    项目中遇到了这样一个需求: 当某个条件满足时就截取当前屏幕.并跳转到另外一个页面,同一时候将这个截屏图片作为下一个页面的背景图片,同一时候背景图片须要模糊处理 接下来就一步一步解决这个问题: 1.截取 ...

  6. QT就是别人好心帮你做一些枯燥，并且很重复的代码编写工作，让你更好的把精力投入到你界面的逻辑和功能的实现的功能库（否则写了上万行代码了，才写出个BUG一大堆的毛坯）

    好了,现在开始记录我学习QT的学习历程 . 本人也不是计算机专业出来的,自学了一点,但还是不好找工作,于是参加了培训,虽然感觉没多学到什么 编程的学习生涯就是不断的看别人的源码,然后自己参考着写写自己 ...

  7. bootsrap中的偏移（栅格系统)

    在最初学习bootsrap这个框架的时候觉得这个框架中的栅格系统是个做自适应很好的工具,而且开发也很方便,是我接触的第一个前端框架,第一次觉得开发如此的简单,今天看到学妹写了一个后台的界面,虽然用到了 ...

  8. EF搭建数据库

    http://blog.csdn.net/mss359681091/article/details/52135867http://blog.csdn.net/x_craft/article/detai ...

  9. js闭包中注意文字总结

    //闭包注意的点 //闭包中使用外部变量不是复制而是引用 //闭包可以节省传递参数问题 //在循环中使用闭包

  10. 51Nod 圆与三角形

    给出圆的圆心和半径,以及三角形的三个顶点,问圆同三角形是否相交.相交输出"Yes",否则输出"No".(三角形的面积大于0).   Input 第1行:一个数T ...