随风奔跑尿飞扬
随风奔跑尿飞扬

js自定义动画函数实现轮播图

缓动动画函数

传入三个参数，分别为：操作元素，操作属性，回调函数

原理： 将定时器ID存储在“操作元素”的属性中，每次调用函数先清除此“操作元素”原有的定时器，以解决动画抖动、多个定时器无法清理的问题。 操作属性可以有多个，以循环的方式遍历属性，当所有的动画完成后调用回调函数

function animate(ele,json,callback,loopTime) {
    clearInterval(ele.timeId);
    loopTime = loopTime?loopTime:20;
    ele.timeId = setInterval(function () {
        var flag = true;
        for (var arr in json) {
            if (arr === 'zIndex') {
                ele.style[arr] = json[arr];  //z-index属性没有单位，直接设置
            }else if (arr === 'opacity') {
                var current = getStyle(ele,arr)*100; //将数值放大一百倍而不使用原有的小数方式
                var target = json[arr]*100;
                var step= (target - current)/10; 
                step = step<0?Math.floor(step):Math.ceil(step); //因为步移距离有正数和负数，所以需要判断取整方式。（0.2取1，向上取整，-0.2取-1，向下取整）
                current += step;
                ele.style[arr] = current/100;
            }else {
                var current = parseInt(getStyle(ele,arr));
                var target = json[arr];
                var step= (target - current)/10;
                step = step<0?Math.floor(step):Math.ceil(step);
                current += step;
                ele.style[arr] = current+'px';
            }
            if (current !== target){
                flag = false
            }
        }
        if (flag){
            clearInterval(ele.timeId);
            if (callback){
                callback();
            }
        }
        console.log('目标位置：'+target+' 当前位置： '+current+'步移距离：'+step)
    },loopTime)
}

上面得代码不够完美，至于缺点在哪就交给你们啦。下面是经过优化得代码。轮播图用得就是这段代码

function animate(ele,target,step,loopTime) {
    var current = ele.offsetLeft;
    // var target = 400;
    step = step?step:10;
    loopTime = loopTime?loopTime:20;
    //这里传入的ele是一个对象，为对象添加了一个属性存储定时器ID。 因为这种方式底层是以内存地址引用的
    //所以这里的属性会被全局保存下来
    clearInterval(ele.timeToolId);
    ele.timeToolId = setInterval(function () {
        current += target>current?step:-step;

        if ( Math.abs(target - current) > Math.abs(step)){
            ele.style.left = current+'px';
        } else {
            ele.style.left = target+'px';
            clearInterval(ele.timeToolId);
        }
    },loopTime)
}

旋转木马轮播图

思路： 首先以定位的方式布局，布局完成后在编写js代码。 将每个图片的位置存放到数组中，每次旋转时将数组的最后一位调换到第一位或反之（依据左右滚动而定）,再使用动画函数赋值。最后一张图片与第一章图片相同，这样形成无缝的效果。

素材我就不放了，交给各位自己度娘了


<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title>
  <style type="text/css">
    * {
      padding: 0;
      margin: 0;
      list-style: none;
      border: 0;
    }

    .all {
      width: 500px;
      height: 200px;
      padding: 7px;
      border: 1px solid #ccc;
      margin: 100px auto;
      position: relative;
    }

    .screen {
      width: 500px;
      height: 200px;
      overflow: hidden;
      position: relative;
    }

    .screen li {
      width: 500px;
      height: 200px;
      overflow: hidden;
      float: left;
    }

    .screen ul {
      position: absolute;
      left: 0;
      top: 0px;
      width: 3000px;
    }

    .all ol {
      position: absolute;
      right: 10px;
      bottom: 10px;
      line-height: 20px;
      text-align: center;
    }

    .all ol li {
      float: left;
      width: 20px;
      height: 20px;
      background: #fff;
      border: 1px solid #ccc;
      margin-left: 10px;
      cursor: pointer;
    }

    .all ol li.current {
      background: #DB192A;
    }

    #arr {
      display: none;
    }

    #arr span {
      width: 40px;
      height: 40px;
      position: absolute;
      left: 5px;
      top: 50%;
      margin-top: -20px;
      background: #000;
      cursor: pointer;
      line-height: 40px;
      text-align: center;
      font-weight: bold;
      font-family: '黑体';
      font-size: 30px;
      color: #fff;
      opacity: 0.3;
      border: 1px solid #fff;
    }

    #arr #right {
      right: 5px;
      left: auto;
    }
  style>
head>
<body>
<div class="all" id='box'>
  <div class="screen">
    <ul>
      <li><img src="images/1.jpg" width="500" height="200"/>li>
      <li><img src="images/2.jpg" width="500" height="200"/>li>
      <li><img src="images/3.jpg" width="500" height="200"/>li>
      <li><img src="images/4.jpg" width="500" height="200"/>li>
      <li><img src="images/5.jpg" width="500" height="200"/>li>
    ul>
    <ol>
    ol>
  div>
  <div id="arr"><span id="left"><span><span id="right">>span>div>
div>
<script src="common.js">script>
<script>
  var box = document.getElementById('box');
  var screen = box.children[0];
  var screenWidth = screen.offsetWidth;
  var ulObj = screen.children[0];
  var olObj = screen.children[1];
  var arr = document.getElementById('arr');
  var arrLeft = document.getElementById('left');
  var arrRight = document.getElementById('right');
  var current = 0;
  var timeId = 0;
  ulObj.appendChild(ulObj.children[0].cloneNode(true));

  for (var i=0;i<ulObj.children.length-1;i++){
    var liObj = document.createElement("li");
    liObj.innerHTML = i+1;
    liObj.setAttribute('index',i);
    liObj.onmouseover = function() {
        animate(ulObj,-this.getAttribute('index')*screenWidth);
        for (var j=0;j<olObj.children.length;j++) {
          olObj.children[j].className='';
        }
        current = -this.getAttribute('index');
        this.className = 'current';
    };
    olObj.appendChild(liObj);
  }
  olObj.children[0].className = 'current';
  box.onmouseover = function () {
    arr.style.display = 'block';
    clearInterval(timeId);
  };
  box.onmouseout = function () {
    arr.style.display = 'none';
    timeId = setInterval(right,2000);
  };
  arrLeft.onclick = function () {
    if (current !==0 ){
      current++;
      animate(ulObj,current*screenWidth);
      for (var j=0;j<olObj.children.length;j++) {
        olObj.children[j].className='';
      }
      olObj.children[Math.abs(current)].className='current';
    }
  };
  arrRight.onclick = right;
  function right() {
    if (Math.abs(current)===ulObj.children.length-1){
      current =0;
      ulObj.style.left = '0px';
    }
    if (Math.abs(current)<ulObj.children.length-1) {
      current--;
      animate(ulObj,current*screenWidth);
      for (var j=0;j<olObj.children.length;j++) {
        olObj.children[j].className='';
      }
      if (Math.abs(current)===ulObj.children.length-1){
        olObj.children[Math.abs(current)-1].className='';
        olObj.children[0].className='current';
      }else{
        olObj.children[Math.abs(current)].className='current';
      }
    }
  }
  timeId = setInterval(right,2000);

script>
body>
html>

你可能感兴趣的:(js)

  • element实现动态路由+面包屑 软件技术NINI vue案例vue.js前端
    el-breadcrumb是ElementUI组件库中的一个面包屑导航组件，它用于显示当前页面的路径，帮助用户快速理解和导航到应用的各个部分。在Vue.js项目中，如果你已经安装了ElementUI，就可以很方便地使用el-breadcrumb组件。以下是一个基本的使用示例：安装ElementUI（如果你还没有安装的话）:你可以通过npm或yarn来安装ElementUI。bash复制代码npmi
  • C#中使用split分割字符串 互联网打工人no1 c#
    1、用字符串分隔：usingSystem.Text.RegularExpressions;stringstr="aaajsbbbjsccc";string[]sArray=Regex.Split(str,"js",RegexOptions.IgnoreCase);foreach(stringiinsArray)Response.Write(i.ToString()+"");输出结果：aaabbbc
  • 【华为OD机试真题2023B卷 JAVA&JS】We Are A Team 若博豆 java算法华为javascript
    华为OD2023（B卷）机试题库全覆盖，刷题指南点这里WeAreATeam时间限制：1秒|内存限制：32768K|语言限制：不限题目描述：总共有n个人在机房，每个人有一个标号（1<=标号<=n），他们分成了多个团队，需要你根据收到的m条消息判定指定的两个人是否在一个团队中，具体的：1、消息构成为：abc，整数a、b分别代
  • 数组去重 好奇的猫猫猫
    整理自js中基础数据结构数组去重问题思考？如何去除数组中重复的项例如数组：[1,3,4,3,5]我们在做去重的时候，一开始想到的肯定是，逐个比较，外面一层循环，内层后一个与前一个一比较，如果是久不将当前这一项放进新的数组，挨个比较完之后返回一个新的去过重复的数组不好的实践方式上述方法效率极低，代码量还多，思考？有没有更好的方法这时候不禁一想当然有了！！！hashtable啊，通过对象的hash办法
  • 【JS】执行时长(100分) |思路参考+代码解析（C++） l939035548 JS算法数据结构c++
    题目为了充分发挥GPU算力，需要尽可能多的将任务交给GPU执行，现在有一个任务数组，数组元素表示在这1秒内新增的任务个数且每秒都有新增任务。假设GPU最多一次执行n个任务，一次执行耗时1秒，在保证GPU不空闲情况下，最少需要多长时间执行完成。题目输入第一个参数为GPU一次最多执行的任务个数，取值范围[1,10000]第二个参数为任务数组长度，取值范围[1,10000]第三个参数为任务数组，数字范围
  • node.js学习 小猿L node.jsnode.js学习vim
    node.js学习实操及笔记温故node.js，node.js学习实操过程及笔记~node.js学习视频node.js官网node.js中文网实操笔记githubcsdn笔记为什么学node.js可以让别人访问我们编写的网页为后续的框架学习打下基础，三大框架vuereactangular离不开node.jsnode.js是什么官网：node.js是一个开源的、跨平台的运行JavaScript的运行
  • docker igotyback eureka云原生
    Docker容器的文件系统是隔离的，但是可以通过挂载卷（Volumes）或绑定挂载（BindMounts）将宿主机的文件系统目录映射到容器内部。要查看Docker容器的映射路径，可以使用以下方法：查看容器配置：使用dockerinspect命令可以查看容器的详细配置信息，包括挂载的卷。例如：bashdockerinspect在输出的JSON格式中，查找"Mounts"部分，这里会列出所有的挂载信息
  • 在Ubuntu中编译含有JSON的文件出现报错 芝麻糊76 Linuxkill_buglinuxubuntujson
    在ubuntu中进行JSON相关学习的时候，我发现了一些小问题，决定与大家进行分享，减少踩坑时候出现不必要的时间耗费截取部分含有JSON部分的代码进行展示char*str="{\"title\":\"JSONExample\",\"author\":{\"name\":\"JohnDoe\",\"age\":35,\"isVerified\":true},\"tags\":[\"json\",\"
  • Xinference如何注册自定义模型 玩人工智能的辣条哥 人工智能AI大模型Xinference
    环境：Xinference问题描述：Xinference如何注册自定义模型解决方案：1.写个model_config.json，内容如下{"version":1,"context_length":2048,"model_name":"custom-llama-3","model_lang":["en","ch"],"model_ability":["generate","chat"],"model
  • Python神器！WEB自动化测试集成工具 DrissionPage 亚丁号 python开发语言
    一、前言用requests做数据采集面对要登录的网站时，要分析数据包、JS源码，构造复杂的请求，往往还要应付验证码、JS混淆、签名参数等反爬手段，门槛较高。若数据是由JS计算生成的，还须重现计算过程，体验不好，开发效率不高。使用浏览器，可以很大程度上绕过这些坑，但浏览器运行效率不高。因此，这个库设计初衷，是将它们合而为一，能够在不同须要时切换相应模式，并提供一种人性化的使用方法，提高开发和运行效率
  • Mongodb Error: queryTxt ETIMEOUT xxxx.wwwdz.mongodb.net 佛一脚 errorreactmongodb数据库
    背景每天都能遇到奇怪的问题，做个记录，以便有缘人能得到帮助！换了一台电脑开发nextjs程序。需要连接mongodb数据，对数据进行增删改查。上一台电脑好好的程序，新电脑死活连不上mongodb数据库。同一套代码，没任何修改，搞得我怀疑人生了，打开浏览器进入mongodb官网毫无问题，也能进入线上系统查看数据，网络应该是没问题。于是我尝试了一下手机热点，这次代码能正常跑起来，连接数据库了！！！是不
  • Vue( ElementUI入门、vue-cli安装) m0_l5z elementuivue.js
    一.ElementUI入门目录：1.ElementUI入门1.1ElementUI简介1.2Vue+ElementUI安装1.3开发示例2.搭建nodejs环境2.1nodejs介绍2.2npm是什么2.3nodejs环境搭建2.3.1下载2.3.2解压2.3.3配置环境变量2.3.4配置npm全局模块路径和cache默认安装位置2.3.5修改npm镜像提高下载速度2.3.6验证安装结果3.运行n
  • 博客网站制作教程 2401_85194651 javamaven
    首先就是技术框架：后端：Java+SpringBoot数据库：MySQL前端：Vue.js数据库连接：JPA(JavaPersistenceAPI)1.项目结构blog-app/├──backend/│├──src/main/java/com/example/blogapp/││├──BlogApplication.java││├──config/│││└──DatabaseConfig.java
  • 00. 这里整理了最全的爬虫框架（Java + Python） 有一只柴犬 爬虫系列爬虫javapython
    目录1、前言2、什么是网络爬虫3、常见的爬虫框架3.1、java框架3.1.1、WebMagic3.1.2、Jsoup3.1.3、HttpClient3.1.4、Crawler4j3.1.5、HtmlUnit3.1.6、Selenium3.2、Python框架3.2.1、Scrapy3.2.2、BeautifulSoup+Requests3.2.3、Selenium3.2.4、PyQuery3.2
  • vue 创建项目报错：command failed: npm install --loglevel error 那鱼、会飞 vue.jsvue-cli3
    这个问题其实很好解决，只是很多种情况，逐一排除即可。稳下心来~vuecli3创建项目我的node版本是node14.15.0，（永远不要尝试最新版本）node各种版本下载地址：以往的版本|Node.js(nodejs.org)vue/[email protected]@vue/[email protected]（注意vue/cli2和vue/cli3的下载命名有所改变，2是-形式，3是/形式）其实报错
  • 更改npm镜像源为淘宝镜像 骆小骆 基于node.js
    npm常用指令后缀*最近复习了一下node.js整理了一下跟node.js相关的指令后缀*--save、-S参数意思是把模块的版本信息保存到dependencies（生产环境依赖）中，即你的package.json文件的dependencies字段中；–--save-dev、-D参数意思是把模块版本信息保存到devDependencies（开发环境依赖）中，即你的package.json文件的de
  • COCO 格式的数据集转化为 YOLO 格式的数据集 QYQY77 YOLOpython
    """--json_path输入的json文件路径--save_path保存的文件夹名字，默认为当前目录下的labels。"""importosimportjsonfromtqdmimporttqdmimportargparseparser=argparse.ArgumentParser()parser.add_argument('--json_path',default='./instances
  • NPM私库搭建-verdaccio（Linux） Beam007 npmlinux前端
    1、安装nodelinux服务器安装nodea)、官网下载所需的node版本https://nodejs.org/dist/v14.21.0/b)、解压安装包若下载的是xxx.tar.xz文件，解压命令为tar-xvfxxx.tar.xzc)、修改环境变量修改：/etc/profile文件#SETPATHFORNODEJSexportNODE_HOME=NODEJS解压安装的路径exportPAT
  • 前端代码上传文件 余生逆风飞翔 前端javascript开发语言
    点击上传文件import{ElNotification}from'element-plus'import{API_CONFIG}from'../config/index.js'import{UploadFilled}from'@element-plus/icons-vue'import{reactive}from'vue'import{BASE_URL}from'../config/index'i
  • golang获取用户输入的几种方式 余生逆风飞翔 golang开发语言后端
    一、定义结构体typeUserInfostruct{Namestring`json:"name"`Ageint`json:"age"`Addstring`json:"add"`}typeReturnDatastruct{Messagestring`json:"message"`Statusstring`json:"status"`DataUserInfo`json:"data"`}二、get请求的
  • VUE3 + xterm + nestjs实现web远程终端 或 连接开启SSH登录的路由器和交换机。 焚木灵 node.jsvue
    可远程连接系统终端或开启SSH登录的路由器和交换机。相关资料：xtermjs/xterm.js:Aterminalfortheweb(github.com)后端实现(NestJS)：1、安装依赖：npminstallnode-ssh@nestjs/websockets@nestjs/platform-socket.io2、我们将创建一个名为RemoteControlModule的NestJS模块，
  • spring mvc @RequestBody String类型参数 zoyation spring-mvcspringmvc
    通过如下配置：text/html;charset=UTF-8application/json;charset=UTF-8在springmvc的Controller层使用@RequestBody接收Content-Type为application/json的数据时，默认支持Map方式和对象方式参数@RequestMapping(value="/{code}/saveUser",method=Requ
  • Vue 项目运行时，报错 Error: Cannot find module ‘node:path‘ 周bro vue.js前端javascriptnode.jsnpm
    node-v是否显示nodenpm-v报错Error:Cannotfindmodule‘node:path'是因为node版本和npm版本不匹配安装相对应的版本node版本10.16.0对应npm版本[email protected]执行该命令即可匹配版本官网https://nodejs.org/en/about/previous-releases
  • 360前端星计划-动画可以这么玩 马小蜗
    动画的基本原理定时器改变对象的属性根据新的属性重新渲染动画functionupdate(context){//更新属性}constticker=newTicker();ticker.tick(update,context);动画的种类1、JavaScript动画操作DOMCanvas2、CSS动画transitionanimation3、SVG动画SMILJS动画的优缺点优点：灵活度、可控性、性能
  • 【vite 自动配置路由】 CODER-V 前端javascriptvue.js前端软件构建
    手动配置路由，是一个没有技术含量又浪费时间的工作。本文将介绍vite构建的vue3项目如何编写一个自动配置路由的脚本。约定大于配置要想使用脚本完成路由的自动配置，我们就需要遵循以下目录规则：每一个页面对应一个包，当前包下的主页面命名为index.vue；每个包里必须配置一个page.js；在每一个page.js里边配置，额外的路由信息，比如：exportdefault{title:'商品',men
  • 探索Zebra4J：构建高效企业级Web应用的微服务框架 叶准鑫Natalie
    探索Zebra4J：构建高效企业级Web应用的微服务框架ZebraZebra4J/Zebra4Js基于SpringBoot的JavaWeb/Nodejs框架项目地址:https://gitcode.com/gh_mirrors/zebra/Zebra项目介绍在当今快速发展的技术环境中，构建高效、可扩展的企业级Web应用是每个开发团队的追求。Zebra4J作为一款基于SpringBoot的全新微服务
  • 【JS】前端文件读取FileReader操作总结 程序员-张师傅 前端前端javascript开发语言
    前端文件读取FileReader操作总结FileReader是JavaScript中的一个WebAPI，它允许web应用程序异步读取用户计算机上的文件（或原始数据缓冲区）的内容，例如读取文件以获取其内容，并在不将文件发送到服务器的情况下在客户端使用它。这对于处理图片、文本文件等非常有用，尤其是当你想要在用户界面中即时显示文件内容或进行文件预览时。创建FileReader对象首先，你需要创建一个Fi
  • 【前端】vue 报错:The template root requires exactly one element 程序员-张师傅 前端前端vue.jsjavascript
    【前端】vue报错:Thetemplaterootrequiresexactlyoneelement在Vue.js中，当你遇到错误“Thetemplaterootrequiresexactlyoneelement”时，这通常意味着你的Vue组件的模板（template）根节点不是单一的元素。Vue要求每个组件的模板必须有一个根元素来包裹所有的子元素。这个错误通常出现在以下几种情况：模板中有多个并行
  • UI 自动化的页面对象管理神器 PO-Manager TesterHome
    原文由alex发表于TesterHome社区网站，点击原文链接可于作者直接交流。做UI自动化的同学都知道，UI自动化一个难点就是页面元素的变化，让自动化维护成为一个痛点。在此，为了减轻这个痛点，我在基于Page-Object模式的基础上开发了页面对象维护的工具。该工具为vscode的一个插件，可以通过vscode插件市场搜索PO-Manager来下载安装本文中的页面对象库文件基于json.一个元素
  • 小程序通过js控制页面字体颜色属性 祈澈菇凉
    需求：当电量少于百分之20的时候，显示电量的字体显示为红色。1：在wxml里面设置属性batStyle：style="{{item.batStyle}}"电量:{{item.battery}}%2：当复合逻辑条件的时候，在js里面carList[i].batStyle="color:red";success:function(res){constcarList=res.data.list;for(
  • 微信开发者验证接口开发 362217990 微信 开发者 token 验证
    微信开发者接口验证。 Token，自己随便定义，与微信填写一致就可以了。 根据微信接入指南描述 http://mp.weixin.qq.com/wiki/17/2d4265491f12608cd170a95559800f2d.html 第一步：填写服务器配置 第二步：验证服务器地址的有效性 第三步：依据接口文档实现业务逻辑 这里主要讲第二步验证服务器有效性。 建一个
  • 一个小编程题-类似约瑟夫环问题 BrokenDreams 编程
            今天群友出了一题：         一个数列,把第一个元素删除,然后把第二个元素放到数列的最后,依次操作下去,直到把数列中所有的数都删除,要求依次打印出这个过程中删除的数。      &
  • linux复习笔记之bash shell (5) 关于减号-的作用 eksliang linux关于减号“-”的含义linux关于减号“-”的用途linux关于“-”的含义linux关于减号的含义
        转载请出自出处： http://eksliang.iteye.com/blog/2105677        管道命令在bash的连续处理程序中是相当重要的，尤其在使用到前一个命令的studout（标准输出）作为这次的stdin（标准输入）时，就显得太重要了，某些命令需要用到文件名，例如上篇文档的的切割命令（split）、还有
  • Unix(3) 18289753290 unix ksh
    1)若该变量需要在其他子进程执行，则可用"$变量名称"或${变量}累加内容 什么是子进程？在我目前这个shell情况下，去打开一个新的shell，新的那个shell就是子进程。一般状态下，父进程的自定义变量是无法在子进程内使用的，但通过export将变量变成环境变量后就能够在子进程里面应用了。 2)条件判断： &&代表and  ||代表or&nbs
  • 关于ListView中性能优化中图片加载问题 酷的飞上天空 ListView
    ListView的性能优化网上很多信息，但是涉及到异步加载图片问题就会出现问题。 具体参看上篇文章http://314858770.iteye.com/admin/blogs/1217594   如果每次都重新inflate一个新的View出来肯定会造成性能损失严重，可能会出现listview滚动是很卡的情况，还会出现内存溢出。 现在想出一个方法就是每次都添加一个标识，然后设置图
  • 德国总理默多克：给国人的一堂“震撼教育”课 永夜-极光 教育
    http://bbs.voc.com.cn/topic-2443617-1-1.html德国总理默多克：给国人的一堂“震撼教育”课　 安吉拉—默克尔，一位经历过社会主义的东德人，她利用自己的博客，发表一番来华前的谈话，该说的话，都在上面说了，全世界想看想传播——去看看默克尔总理的博客吧！ 　　德国总理默克尔以她的低调、朴素、谦和、平易近人等品格给国人留下了深刻印象。她以实际行动为中国人上了一堂
  • 关于Java继承的一个小问题。。。 随便小屋 java
    今天看Java 编程思想的时候遇见一个问题，运行的结果和自己想想的完全不一样。先把代码贴出来！ //CanFight接口 interface Canfight { void fight(); } //ActionCharacter类 class ActionCharacter { public void fight() { System.out.pr
  • 23种基本的设计模式 aijuans 设计模式
    Abstract Factory：提供一个创建一系列相关或相互依赖对象的接口，而无需指定它们具体的类。 　　Adapter：将一个类的接口转换成客户希望的另外一个接口。A d a p t e r模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。 　　Bridge：将抽象部分与它的实现部分分离，使它们都可以独立地变化。 　　Builder：将一个复杂对象的构建与它的表示分离，使得同
  • 《周鸿祎自述：我的互联网方法论》读书笔记 aoyouzi 读书笔记
    从用户的角度来看,能解决问题的产品才是好产品,能方便/快速地解决问题的产品,就是一流产品.   商业模式不是赚钱模式 一款产品免费获得海量用户后,它的边际成本趋于0,然后再通过广告或者增值服务的方式赚钱,实际上就是创造了新的价值链.   商业模式的基础是用户,木有用户,任何商业模式都是浮云.商业模式的核心是产品,本质是通过产品为用户创造价值. 商业模式还包括寻找需求
  • JavaScript动态改变样式访问技术 百合不是茶 JavaScriptstyle属性ClassName属性
      一:style属性 格式:  HTML元素.style.样式属性="值";   创建菜单:在html标签中创建 或者 在head标签中用数组创建   <html> <head> <title>style改变样式</title> </head> &l
  • jQuery的deferred对象详解 bijian1013 jquerydeferred对象
            jQuery的开发速度很快，几乎每半年一个大版本，每两个月一个小版本。         每个版本都会引入一些新功能，从jQuery 1.5.0版本开始引入的一个新功能----deferred对象。    &nb
  • 淘宝开放平台TOP Bill_chen C++c物流C#
    淘宝网开放平台首页：http://open.taobao.com/ 淘宝开放平台是淘宝TOP团队的产品，TOP即TaoBao Open Platform， 是淘宝合作伙伴开发、发布、交易其服务的平台。 支撑TOP的三条主线为：    1.开放数据和业务流程     * 以API数据形式开放商品、交易、物流等业务；  &
  • 【大型网站架构一】大型网站架构概述 bit1129 网站架构
    大型互联网特点 面对海量用户、海量数据 大型互联网架构的关键指标 高并发 高性能 高可用 高可扩展性 线性伸缩性 安全性 大型互联网技术要点   前端优化 CDN缓存 反向代理 KV缓存 消息系统 分布式存储 NoSQL数据库 搜索 监控 安全 想到的问题： 1.对于订单系统这种事务型系统，如
  • eclipse插件hibernate tools安装 白糖_ Hibernate
    eclipse helios(3.6)版 1.启动eclipse 2.选择 Help > Install New Software...> 3.添加如下地址： http://download.jboss.org/jbosstools/updates/stable/helios/ 4.选择性安装：hibernate tools在All Jboss tool
  • Jquery easyui Form表单提交注意事项 bozch jquery easyui
    jquery easyui对表单的提交进行了封装，提交的方式采用的是ajax的方式，在开发的时候应该注意的事项如下：         1、在定义form标签的时候，要将method属性设置成post或者get，特别是进行大字段的文本信息提交的时候，要将method设置成post方式提交，否则页面会抛出跨域访问等异常。所以这个要
  • Trie tree(字典树)的Java实现及其应用-统计以某字符串为前缀的单词的数量 bylijinnan java实现
    import java.util.LinkedList; public class CaseInsensitiveTrie { /** 字典树的Java实现。实现了插入、查询以及深度优先遍历。 Trie tree's java implementation.(Insert,Search,DFS) Problem Description Igna
  • html css 鼠标形状样式汇总 chenbowen00 htmlcss
    css鼠标手型cursor中hand与pointer  Example：CSS鼠标手型效果 <a href="#" style="cursor:hand">CSS鼠标手型效果</a><br/>  Example：CSS鼠标手型效果 <a href="#" style=&qu
  • [IT与投资]IT投资的几个原则 comsci it
          无论是想在电商,软件,硬件还是互联网领域投资,都需要大量资金,虽然各个国家政府在媒体上都给予大家承诺,既要让市场的流动性宽松,又要保持经济的高速增长....但是,事实上,整个市场和社会对于真正的资金投入是非常渴望的,也就是说,表面上看起来,市场很活跃,但是投入的资金并不是很充足的......    
  • oracle with语句详解 daizj oraclewithwith as
    oracle with语句详解 转 在oracle中，select 查询语句，可以使用with,就是一个子查询，oracle 会把子查询的结果放到临时表中，可以反复使用 例子:注意，这是sql语句，不是pl/sql语句， 可以直接放到jdbc执行的 ----------------------------------------------------------------
  • hbase的简单操作 deng520159 数据库hbase
    近期公司用hbase来存储日志,然后再来分析 ,把hbase开发经常要用的命令找了出来. 用ssh登陆安装hbase那台linux后 用hbase shell进行hbase命令控制台! 表的管理 1）查看有哪些表 hbase(main)> list 2）创建表   # 语法：create <table>, {NAME => <family&g
  • C语言scanf继续学习、算术运算符学习和逻辑运算符 dcj3sjt126com c
    /* 2013年3月11日20:37:32 地点：北京潘家园 功能：完成用户格式化输入多个值 目的：学习scanf函数的使用 */ # include <stdio.h> int main(void) { int i, j, k; printf("please input three number:\n"); //提示用
  • 2015越来越好 dcj3sjt126com 歌曲
    越来越好 房子大了电话小了 感觉越来越好 假期多了收入高了 工作越来越好 商品精了价格活了 心情越来越好 天更蓝了水更清了 环境越来越好 活得有奔头人会步步高 想做到你要努力去做到 幸福的笑容天天挂眉梢 越来越好 婆媳和了家庭暖了 生活越来越好 孩子高了懂事多了 学习越来越好 朋友多了心相通了 大家越来越好 道路宽了心气顺了 日子越来越好 活的有精神人就不显
  • java.sql.SQLException: Value '0000-00-00' can not be represented as java.sql.Tim feiteyizu mysql
    数据表中有记录的time字段（属性为timestamp）其值为：“0000-00-00 00:00:00” 程序使用select 语句从中取数据时出现以下异常： java.sql.SQLException:Value '0000-00-00' can not be represented as java.sql.Date   java.sql.SQLException: Valu
  • Ehcache（07）——Ehcache对并发的支持 234390216 并发ehcache锁ReadLockWriteLock
    Ehcache对并发的支持          在高并发的情况下，使用Ehcache缓存时，由于并发的读与写，我们读的数据有可能是错误的，我们写的数据也有可能意外的被覆盖。所幸的是Ehcache为我们提供了针对于缓存元素Key的Read（读）、Write（写）锁。当一个线程获取了某一Key的Read锁之后，其它线程获取针对于同
  • mysql中blob,text字段的合成索引 jackyrong mysql
      在mysql中，原来有一个叫合成索引的，可以提高blob,text字段的效率性能， 但只能用在精确查询，核心是增加一个列，然后可以用md5进行散列，用散列值查找 则速度快 比如： create table abc(id varchar(10),context blog,hash_value varchar(40)); insert into abc(1,rep
  • 逻辑运算与移位运算 latty 位运算逻辑运算
    源码：正数的补码与原码相同例+7 源码：00000111 补码 ：00000111 （用8位二进制表示一个数） 负数的补码： 符号位为1，其余位为该数绝对值的原码按位取反；然后整个数加1。   -7 源码： 10000111 ，其绝对值为00000111  取反加一：11111001 为-7补码 已知一个数的补码，求原码的操作分两种情况：
  • 利用XSD 验证XML文件 newerdragon javaxmlxsd
    XSD文件 （XML Schema 语言也称作 XML Schema 定义（XML Schema Definition，XSD）。 具体使用方法和定义请参看： http://www.w3school.com.cn/schema/index.asp java自jdk1.5以上新增了SchemaFactory类 可以实现对XSD验证的支持，使用起来也很方便。 以下代码可用在J
  • 搭建 CentOS 6 服务器(12) - Samba rensanning centos
    （1）安装 # yum -y install samba Installed: samba.i686 0:3.6.9-169.el6_5 # pdbedit -a rensn new password:123456 retype new password:123456 …… （2）Home文件夹 # mkdir /etc
  • Learn Nodejs 01 toknowme nodejs
    （1）下载nodejs https://nodejs.org/download/ 选择相应的版本进行下载     （2）安装nodejs 安装的方式比较多，请baidu下 我这边下载的是“node-v0.12.7-linux-x64.tar.gz”这个版本 （1）上传服务器 （2）解压 tar -zxvf  node-v0.12.
  • jquery控制自动刷新的代码举例 xp9802 jquery
    1、html内容部分  复制代码代码示例: <div id='log_reload'> <select name="id_s" size="1"> <option value='2'>-2s-</option> <option value='3'>-3s-</option
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他