withwz_
withwz_

css+js实现轮播banner

基本功能

  • 轮回播放
  • 自定义过渡时间、间隔时间
  • 上一张、下一张

完整代码


<html>

<head lang="en">
  <meta charset="UTF-8">
  <title>title>
  <style>
    * {
      padding: 0;
      margin: 0;
    }

    .container {
      width: 126px;
      height: 86px;
      overflow: hidden;
      margin: 100px auto;
      background-color: aquamarine;
    }

    .swiper {
      list-style: none;
      display: flex;
      /* transition: all 400ms ease-in-out; */
    }

    .swiper:hover {
      animation-play-state: paused;
    }

    .item {
      flex-basis: 126px;
      flex-shrink: 0;
      width: 126px;
      height: 86px;
      background: rgba(11, 22, 11, .4);
      box-sizing: border-box;
      border: 2px solid red;
    }

    .img {
      width: 100%;
      height: 100%;
      overflow: hidden;
    }


    .control {
      display: flex;
      justify-content: center;
    }
  style>
head>

<body>
  <div class="container">
    <ul class="swiper">
      <li class="item">
        
        <img class="img" src="images/1.jpg" alt="" />
      li>
      <li class="item">
        
        <img class="img" src="images/2.jpg" alt="" />
      li>
      <li class="item">
        
        <img class="img" src="images/3.jpg" alt="" />
      li>
      <li class="item">
        
        <img class="img" src="images/4.jpg" alt="" />
      li>
      <li class="item">
        
        <img class="img" src="images/5.jpg" alt="" />
      li>
      <li class="item">
        
        <img class="img" src="images/6.jpg" alt="" />
      li>
      <li class="item">
        
        <img class="img" src="images/7.jpg" alt="" />
      li>
    ul>
  div>
  <div class="control">
    <div>
      轮播间隔：
      <input id="input1" type="text" value="800">
      <br />
      过渡时间：
      <input id="input2" type="text" value="400">
      <br />
      <button id="btn">重置轮播button>
      <br />
      <button id="pre">上一张button>
      <button id="next">下一张button>
    div>
  div>

  <script>
    window.onload = function () {
      const swiper = document.querySelectorAll('.swiper')[0]
      const count = document.querySelectorAll('.item').length
      let timer
      let mark = -1
      let i = 0

      const getI = (i) => {
        if (i < 1 || (i < count - 1 && i > mark)) {
          mark = i
          return ++i
        } else {
          --i
          mark = i
          return i
        }
      }

      const refrence = () => {
        clearInterval(timer)
        const interval = document.querySelector('#input1').value
        const duration = document.querySelector('#input2').value
        console.log(interval, duration)
        swiper.style.transition = `all ${duration}ms ease-in-out`
        timer = setInterval(() => {
          i = getI(i)
          swiper.style.transform = `translate(${-126 * i}px)`
        }, interval)
      }

      refrence()

      document.querySelector('#btn').onclick = refrence

      document.querySelector('#pre').onclick = () => {
        i = getI(i)
        swiper.style.transform = `translate(${-126 * i}px)`
      }

      document.querySelector('#next').onclick = () => {
        i = getI(i)
        swiper.style.transform = `translate(${-126 * i}px)`
      }

    }

  script>
body>

html>

样图

css+js实现轮播banner_第1张图片

依赖

无

优化

上一张、下一张有问题

完整代码

https://github.com/withwz/swiper

你可能感兴趣的:(前端)

  • 免费开源的后端API服务-supabase安装和使用-简直是前端学习者福音 前端三评 strapiAjax工具开源前端supabase
    文章目录它是什么安装和部署关于安装关于部署1、注册用户2、创建组织3、创建项目创建数据库表（填充内容）填充数据库表使用postman联调API它是什么一个开源免费的后端框架，firebase的替代品。可以简单理解类似于headlesscms，但是不仅仅只提供内容，它还集成了服务订阅、即时API，用户身份认证（包括第三方身份认证，比如使用github、Google等账号实现快速登录和注册）、边缘函数
  • 前端新手如何用vite构建小程序中使用的模块（以AES加密模块crypto-js为例） warmbook 前端前端小程序javascript
    如果你只是想简单地把在vite项目中使用的模块引入到小程序中，不妨试试库模式。以crypto-js为例，你需要写两个JS文件：一个是构建脚本，类似于vite.config.js；//build.cjsconst{build}=require('vite'),path=require('path');build({publicDir:false,configFile:false,runtimeCom
  • 【原生JS】如何优雅地读、改location.search（queryString或GET参数） warmbook 前端javascript开发语言ecmascript
    应用场景location.search完全由JS脚本管理，并且需要不刷新页面地修改其内容。例如在Oauth2授权中，如果是前端取参提交给后端API向平台方请求accessToken，需要及时删除GET参数中的code，以防用户刷新浏览器导致用失效的code处理登录。实现思路将queryString转为对象并用ES6的Proxy代理，在set、delete钩子中调用history.replaceSt
  • 基于 Node.js 的天气查询系统实现(附源码） Kasper0121 node.js
    项目概述这是一个基于Node.js的全栈应用，前端使用原生JavaScript和CSS，后端使用Express框架，通过调用第三方天气API实现天气数据的获取和展示。主要功能默认显示多个主要城市的天气信息支持城市天气搜索响应式布局设计深色主题界面优雅的加载动画技术栈后端：Node.js+Express前端：HTML5+CSS3+JavaScriptHTTP客户端：AxiosAPI：天气API(v1
  • 前端 | 浏览器安全：XSS攻击、CSRF攻击、中间人攻击 酒酿泡芙1217 前端安全xsscsrf
    1.XSS攻击1.1什么是XSS攻击XSS攻击指的是跨站脚本攻击，是一种代码注入攻击。攻击者通过在网站注入恶意脚本，使之在用户的浏览器上运行，从而盗用用户的信息如cookie等本质是因为网站没有对恶意代码进行过滤，与正常的代码混合在一起了，浏览器没有办法分辨那些脚本是可信的，从而导致了恶意代码的执行攻击者通过这种攻击方式可以进行一下操作：获取页面的数据，如DOM、cookie、localStora
  • HTML&CSS ：如此优雅丝滑的导航栏，你不看看吗？ 前端Hardy CSShtmlcss前端javascript
    这段代码创建了一个动态的导航栏，通过CSS技术实现了按钮的激活和悬停效果，以及动态背景效果，为页面添加了视觉吸引力和用户交互体验。大家复制代码时，可能会因格式转换出现错乱，导致样式失效。建议先少量复制代码进行测试，若未能解决问题，私信我，我会发送完整的压缩包给你演示效果HTML&CSS公众号关注：前端Hardybody{margin:0;padding:0;background-color:#07
  • mybatisplus获取返回对象（自增ID） 笑发财了1 springboot后端jarjavamavenmysql个人开发
    需求有时候我们在数据库里设置了属性自增，在添加对象后，前端需要我们返回这个属性（对象）。做法1.在该实体类的自增主键上加上注解@TableId(value="journey_location_id")，后面的type是默认值可以不写。value为数据表中的字段名@TableId(value="journey_location_id",type=IdType.AUTO)privateintjourn
  • Vue组件的概念与复用 2401_85969651 vue.jsjavascript前端visualstudiocode
    目录一、引言二、为什么使用组件二、什么是Vue组件三、组件的复用优势四、组件复用的实现方式五、组件通信六、总结一、引言在Vue.js的世界里，组件是构建用户界面的基石。它们让我们能够以一种高效、可维护的方式开发复杂的前端应用。无论是初涉Vue的新手，还是有一定经验的开发者，深入理解组件的概念与复用机制，都能极大提升开发效率与代码质量。二、为什么使用组件随着前端应用日益复杂，页面功能愈发繁多，传统的
  • Vue 组件的概念与复用 2401_85969651 vue.js前端javascriptvisualstudiocode
    目录一、引言二、什么是Vue组件三、组件的复用优势四、组件复用的实现方式五、组件通信六、总结一、引言在Vue.js的奇妙天地里，组件宛如熠熠生辉的基石，稳稳撑起用户界面构建的大厦。无论你是刚踏入Vue领域的新手，还是久经沙场的开发者，吃透组件的概念与复用窍门，都如同掌握了一把开启高效开发、优质代码大门的金钥匙，能让你的前端开发之旅畅行无阻。二、什么是Vue组件本质上，Vue组件就是一个被赋予独特魅
  • LogicFlow 一款流程图编辑框架 小毛驴850 流程图
    LogicFlow是什么LogicFlow是一款流程图编辑框架，提供了一系列流程图交互、编辑所必需的功能和灵活的节点自定义、插件等拓展机制。LogicFlow支持前端自定义开发各种逻辑编排场景，如流程图、ER图、BPMN流程等。在工作审批流配置、机器人逻辑编排、无代码平台流程配置都有较好的应用。官方网站更多资料请查看LogicFlow系列文章特性可视化模型：通过LogicFlow提供的直观可视化界
  • 跨域问题及其解决方案 山禾女鬼001 网络网络协议
    在现代Web开发中，跨域问题是开发者经常遇到的一个难题，尤其是在前后端分离架构中。跨域问题的核心在于浏览器的同源策略，这种策略的设计目的是防止恶意网站窃取用户的数据。然而，在一些场景下，比如前后端分离的Web应用中，前端需要访问不同域的资源，这时就会遇到跨域请求的问题。为了解决这个问题，CORS（跨域资源共享）机制应运而生。本文将详细探讨跨域问题的成因、CORS机制的工作原理以及常见的跨域解决方案
  • 基于Springboot用axiospost请求接收字符串参数为null的解决方案 呀243 springboot后端java
    问题今天在用前端post请求后端时发现，由于是以Json对象的形式传输的，后端用两个字符串形参无法获取到对应的参数值前端代码如下：axios.post('http://localhost:8083/test/postParams',{a:'1',b:'2'},{'Content-Type':'application/json'}).then(response=>{console.log(respo
  • vscode 前端常用插件安装大全 weixin_42113341 vscode前端ide
    在使用VisualStudioCode(VSCode)进行前端（特别是Vue.js）和Node.js开发时，安装合适的扩展插件可以大大提升开发效率和代码质量。以下是推荐的Vue.js和Node.js开发相关的VSCode插件，涵盖了代码编辑、调试、格式化、版本控制、代码质量等多个方面。您可以根据自己的需求选择安装：1.核心开发插件1.1Vetur功能：为Vue.js提供语法高亮、智能提示、错误检查
  • Rasa的工作流程 不会编程的程序猿ᅟ rasa
    Rasa的工作流程分为两个主要部分：NLU（自然语言理解）和Core（对话管理）。整个流程包括从用户输入到最终响应的多个步骤，下面是详细的工作流程解析：1.用户输入用户通过聊天界面（如微信、Telegram、Slack或Web前端）发送自然语言消息，例如："我想预订一张明天去北京的火车票"2.自然语言理解（NLU）Rasa的NLU模块解析用户输入，提取意图和实体。2.1意图识别NLU模块会识别用户
  • 使用 Intersection Observer 实现高效懒加载和滚动监听 桂月二二 macos前端框架前端
    在前端开发中，性能优化是提升用户体验的核心之一。随着网页内容的日益增多，如何高效地加载图片、视频等资源，以及如何监听用户的滚动行为，成为了前端开发者需要解决的难题。传统的滚动事件监听往往会带来性能瓶颈，尤其是在需要频繁触发的情况下。为此，IntersectionObserverAPI应运而生，它能让开发者更高效、灵活地处理懒加载和滚动监听等需求。本文将深入介绍如何使用IntersectionObs
  • 一个上亿用户的电商平台的架构设计 北京小太阳 java算法
    一.总体架构Listitem客户端层(ClientLayer)Web客户端：使用现代前端框架（如React,Angular,Vue.js）开发响应式网页，保证在不同设备上的良好用户体验。移动客户端：开发iOS和Android原生应用，利用平台特性提供优质用户体验。或者使用ReactNative或Flutter等跨平台框架来节省开发成本。2.API层(APILayer)API设计：设计RESTful
  • 基于JAVA软件技术课程学习系统设计与实现计算机毕业设计源码+数据库+lw文档+系统+部署 小朱科技 学习
    基于JAVA软件技术课程学习系统设计与实现计算机毕业设计源码+数据库+lw文档+系统+部署基于JAVA软件技术课程学习系统设计与实现计算机毕业设计源码+数据库+lw文档+系统+部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQ
  • java计算机毕业设计-学生宿舍故障报修管理信息系统-源码+数据库+系统+lw文档+mybatis+运行部署 雪夜科技 mybatisjava数据库
    java计算机毕业设计-学生宿舍故障报修管理信息系统-源码+数据库+系统+lw文档+mybatis+运行部署java计算机毕业设计-学生宿舍故障报修管理信息系统-源码+数据库+系统+lw文档+mybatis+运行部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Wi
  • 25-5 SQL 注入攻击 - insert注入 技术探索 Web安全攻防全解析sql数据库
    环境准备：构建完善的安全渗透测试环境：推荐工具、资源和下载链接_渗透测试靶机下载-CSDN博客一、注入原理描述：insert注入是指通过前端注册的信息被后台通过insert操作插入到数据库中。如果后台没有做相应的处理，就可能导致insert注入漏洞。原因：后台未对用户输入进行充分验证和过滤，导致恶意用户可以利用特定的输入构造恶意代码，从而影响数据库的插入操作，或者获取敏感数据。二、注入方法注入手段
  • Docker多架构镜像构建踩坑记 一直学下去 docker容器adm64arm64多架构
    背景公司为了做信创项目的亮点，需要将现有的一套在X86上运行的应用系统迁移到ARM服务器上运行，整个项目通过后端Java，前端VUEJS开发通过CICD做成Docker镜像在K8S里面运行。但是当前的CICD产品不支持ARM的镜像构建，于是只能手工构建ARM镜像。以下是一些踩坑的记录，希望能帮大家少踩坑构建环境本地电脑DeepinLinux23(Windows的WSL和其他的Linux系统都可以）
  • 前端力扣刷题 | 1：Hot100之 哈希 酒酿泡芙1217 力扣hot100哈希算法leetcode前端
    1.两数之和给定一个整数数组nums和一个整数目标值target，请你在该数组中找出和为目标值target的那两个整数，并返回它们的数组下标。你可以假设每种输入只会对应一个答案，并且你不能使用两次相同的元素。你可以按任意顺序返回答案。示例：输入：nums=[2,7,11,15],target=9输出：[0,1]解释：因为nums[0]+nums[1]==9，返回[0,1]。法一：暴力解法vartw
  • vue使用pdf.js实现移动端在线PDF文件预览 yujin0213 vuejavascriptvue.js开发语言
    背景产品需求涉及到动态的PDF展示，PDF是由后端去生成的，然后下发给前端在线的cdn地址，H5需要实现在线PDF预览的能力方案H5展示合同PDF，有很多实现方式。但是通过尝试后发现在不同操作系统会存在兼容性问题方案表现iframe的形式iOS：只能展示第一页，多页不能展示Android：弹出下载弹窗PC：正常展示embed标签iOS：只能展示第一页Android：弹出下载弹窗PC：显示不出来vu
  • WPF之comboBox可模糊查询 白驹……过隙 WPFwpf
    前言本文采用了prism框架的基础。0、先准备一个类publicclassComboBoxItemModel{publicstringName{get;set;}publicstringValue{get;set;}}一、xaml代码。前端这里需添加两个属性，还有keyUp事件等。1、IsEditable="True"（开启可编辑）2、IsTextSearchEnabled="False"（开启可
  • PC端后台管理系统实现在线预览文件 在下不知好歹 前端javascripthtml
    PC端后台管理系统实现在线预览文件后台管理系统是每个新手前端必然接触的项目，当产品要求在线预览文件的预览的时候，我收集了两种在线预览的方法，希望对一些刚入门的小白有所帮助1.使用iframe标签微软有一个解析地址，Word、Xls、PPT这些文件需要使用微软官方的解析地址，如微软解析地址：https://view.officeapps.live.com/op/view.aspx?src=你的文件地
  • 如何实现 Handy Control DataGrid 全选功能 东百牧码人 状态模式
    如何实现HandyControlDataGrid全选功能在使用HandyControl的DataGrid控件时，经常会有全选的需求。今天我们就结合一段代码，详细介绍如何实现HandyControlDataGrid的全选功能。代码实现前端XAML代码代码解释DataGrid是主要的表格控件，ItemsSource绑定到TrendTagCollection，这是数据源集合。DataGridCheckB
  • 微前端架构在前端开发中的实践与挑战 桂月二二 前端架构
    随着单页面应用（SPA）和前端框架如React、Vue、Angular的快速发展，现代前端应用的复杂度日益提升。尤其是当应用规模逐渐增大时，单一的代码库往往难以应对不同团队的协作和版本管理问题。为了应对这一挑战，微前端架构（MicroFrontends）应运而生，它为前端开发提供了一种新的思路，让大型前端应用能够像后端的微服务架构一样，通过拆分模块来降低复杂度。在这篇文章中，我们将探讨微前端架构的
  • Go分布式爬虫笔记(八)_golang分布式爬虫 2401_87299701 golang分布式爬虫
    +爬虫引擎为基础的推送系统+提供-快速的热点事件-事件预警用户需求快速了解自己感兴趣的最新新闻事件预警机制帮助快速决策功能需求用户填写或选择自己感兴趣的话题、感兴趣的网站还有消息接受频率用户接收最新热点事件的推送用户通过点击获取与该事件关联的事件，并得到相关的事件预测、预警，甚至可能在网站中进行快速的交易用户可以查看历史记录，可视化呈现某一个事件的来龙去脉，并进行复盘产品需求前端页面设计用户交互设
  • web速览 qzhqbb web前端web
    web速览1.前端开发概述：前端开发是构建网站用户界面的过程，主要关注网站的视觉效果和用户体验。又称为客户端技术栈：HTML（超文本标记语言）：用于创建网页的结构和内容。CSS（层叠样式表）：用于样式和布局设计，包括颜色、字体、边距等。JavaScript：用于实现网页的交互性和动态效果。前端框架：React：一个用于构建用户界面的JavaScript库，采用组件化设计。Vue.js：一个渐进式的
  • Spring MVC 中的 DispatcherServlet：工作流程与应用场景解析 码农小灰 SpringMVC面试题SpringBootspringmvcjava
    目录一、初始化阶段二、请求处理阶段三、异常处理四、使用场景说明在SpringMVC框架中，DispatcherServlet扮演着至关重要的角色，它作为前端控制器（FrontController），负责接收客户端的HTTP请求，并根据配置将其分发给相应的处理器进行处理。以下是对其工作流程的详细解析，并结合使用场景进行说明。一、初始化阶段加载配置文件：DispatcherServlet在启动时会读取
  • 使用 AI 助手提升前端代码质量：自动代码审查实战 技术出海录 远洋录·技术篇人工智能前端
    最近在带团队的时候，发现代码审查（CodeReview）总是成为项目进度的一个瓶颈。一方面，高级工程师的时间很宝贵，不可能审查每一行代码；另一方面，初级工程师又急需及时的反馈来提升。于是我就在想：能不能用AI来解决这个问题？经过一番研究和实践，我搭建了一个AI代码审查助手，效果出乎意料的好！今天就来分享下这个小工具是怎么做的。为什么需要AI代码审查？说实话，最开始团队里有不少质疑的声音：“AI能审
  • 解线性方程组 qiuwanchi
    package gaodai.matrix; import java.util.ArrayList; import java.util.List; import java.util.Scanner; public class Test { public static void main(String[] args) { Scanner scanner = new Sc
  • 在mysql内部存储代码 annan211 性能mysql存储过程触发器
    在mysql内部存储代码 在mysql内部存储代码，既有优点也有缺点，而且有人倡导有人反对。 先看优点： 1 她在服务器内部执行，离数据最近，另外在服务器上执行还可以节省带宽和网络延迟。 2 这是一种代码重用。可以方便的统一业务规则，保证某些行为的一致性，所以也可以提供一定的安全性。 3 可以简化代码的维护和版本更新。 4 可以帮助提升安全，比如提供更细
  • Android使用Asynchronous Http Client完成登录保存cookie的问题 hotsunshine android
    Asynchronous Http Client是android中非常好的异步请求工具 除了异步之外还有很多封装比如json的处理，cookie的处理 引用 Persistent Cookie Storage with PersistentCookieStore This library also includes a PersistentCookieStore whi
  • java面试题 Array_06 java面试
    java面试题 第一，谈谈final, finally, finalize的区别。 final-修饰符（关键字）如果一个类被声明为final，意味着它不能再派生出新的子类，不能作为父类被继承。因此一个类不能既被声明为 abstract的，又被声明为final的。将变量或方法声明为final，可以保证它们在使用中不被改变。被声明为final的变量必须在声明时给定初值，而在以后的引用中只能
  • 网站加速 oloz 网站加速
    前序:本人菜鸟，此文研究总结来源于互联网上的资料，大牛请勿喷！本人虚心学习，多指教. 1、减小网页体积的大小，尽量采用div+css模式，尽量避免复杂的页面结构，能简约就简约。 2、采用Gzip对网页进行压缩；    GZIP最早由Jean-loup Gailly和Mark Adler创建，用于UNⅨ系统的文件压缩。我们在Linux中经常会用到后缀为.gz
  • 正确书写单例模式 随意而生 java 设计模式 单例
    　　单例模式算是设计模式中最容易理解，也是最容易手写代码的模式了吧。但是其中的坑却不少，所以也常作为面试题来考。本文主要对几种单例写法的整理，并分析其优缺点。很多都是一些老生常谈的问题，但如果你不知道如何创建一个线程安全的单例，不知道什么是双检锁，那这篇文章可能会帮助到你。 　　懒汉式，线程不安全 　　当被问到要实现一个单例模式时，很多人的第一反应是写出如下的代码，包括教科书上也是这样
  • 单例模式 香水浓 java
    懒汉  调用getInstance方法时实例化 public class Singleton { private static Singleton instance; private Singleton() {} public static synchronized Singleton getInstance() { if(null == ins
  • 安装Apache问题：系统找不到指定的文件 No installed service named "Apache2" AdyZhang apachehttp server
    安装Apache问题：系统找不到指定的文件 No installed service named "Apache2" 每次到这一步都很小心防它的端口冲突问题，结果，特意留出来的80端口就是不能用，烦。 解决方法确保几处： 1、停止IIS启动 2、把端口80改成其它 （譬如90，800，，，什么数字都好） 3、防火墙(关掉试试) 在运行处输入 cmd 回车，转到apa
  • 如何在android 文件选择器中选择多个图片或者视频？ aijuans android
    我的android app有这样的需求，在进行照片和视频上传的时候，需要一次性的从照片/视频库选择多条进行上传 但是android原生态的sdk中，只能一个一个的进行选择和上传。 我想知道是否有其他的android上传库可以解决这个问题，提供一个多选的功能，可以使checkbox之类的，一次选择多个 处理方法 官方的图片选择器(但是不支持所有版本的androi，只支持API Level
  • mysql中查询生日提醒的日期相关的sql baalwolf mysql
    SELECT sysid,user_name,birthday,listid,userhead_50,CONCAT(YEAR(CURDATE()),DATE_FORMAT(birthday,'-%m-%d')),CURDATE(),  dayofyear( CONCAT(YEAR(CURDATE()),DATE_FORMAT(birthday,'-%m-%d')))-dayofyear(
  • MongoDB索引文件破坏后导致查询错误的问题 BigBird2012 mongodb
    问题描述： MongoDB在非正常情况下关闭时，可能会导致索引文件破坏，造成数据在更新时没有反映到索引上。 解决方案：   使用脚本，重建MongoDB所有表的索引。 var names = db.getCollectionNames(); for( var i in names ){ var name = names[i]; print(name);
  • Javascript Promise bijian1013 JavaScriptPromise
            Parse JavaScript SDK现在提供了支持大多数异步方法的兼容jquery的Promises模式，那么这意味着什么呢，读完下文你就了解了。 一.认识Promises         “Promises”代表着在javascript程序里下一个伟大的范式，但是理解他们为什么如此伟大不是件简
  • [Zookeeper学习笔记九]Zookeeper源代码分析之Zookeeper构造过程 bit1129 zookeeper
       Zookeeper重载了几个构造函数，其中构造者可以提供参数最多，可定制性最多的构造函数是     public ZooKeeper(String connectString, int sessionTimeout, Watcher watcher, long sessionId, byte[] sessionPasswd, boolea
  • 【Java命令三】jstack bit1129 jstack
    jstack是用于获得当前运行的Java程序所有的线程的运行情况(thread dump），不同于jmap用于获得memory dump   [hadoop@hadoop sbin]$ jstack Usage: jstack [-l] <pid> (to connect to running process) jstack -F
  • jboss 5.1启停脚本　动静分离部署 ronin47
    以前启动jboss，往各种xml配置文件，现只要运行一句脚本即可。start nohup sh /**/run.sh -c servicename  -b ip -g  clustername   -u broatcast jboss.messaging.ServerPeerID=int  -Djboss.service.binding.set=p
  • UI之如何打磨设计能力? brotherlamp UIui教程ui自学ui资料ui视频
      在越来越拥挤的初创企业世界里，视觉设计的重要性往往可以与杀手级用户体验比肩。在许多情况下，尤其对于 Web 初创企业而言，这两者都是不可或缺的。前不久我们在《右脑革命：别学编程了，学艺术吧》中也曾发出过重视设计的呼吁。如何才能提高初创企业的设计能力呢?以下是 9 位创始人的体会。 1.找到自己的方式 如果你是设计师，要想提高技能可以去设计博客和展示好设计的网站如D-lists或
  • 三色旗算法 bylijinnan java算法
    import java.util.Arrays; /** 问题： 假设有一条绳子，上面有红、白、蓝三种颜色的旗子，起初绳子上的旗子颜色并没有顺序， 您希望将之分类，并排列为蓝、白、红的顺序，要如何移动次数才会最少，注意您只能在绳 子上进行这个动作，而且一次只能调换两个旗子。 网上的解法大多类似： 在一条绳子上移动，在程式中也就意味只能使用一个阵列，而不使用其它的阵列来
  • 警告:No configuration found for the specified action: \'s chiangfai configuration
    1.index.jsp页面form标签未指定namespace属性。 <!--index.jsp代码--> <%@taglib prefix="s" uri="/struts-tags"%> ... <s:form action="submit" method="post"&g
  • redis -- hash_max_zipmap_entries设置过大有问题 chenchao051 redishash
    使用redis时为了使用hash追求更高的内存使用率，我们一般都用hash结构，并且有时候会把hash_max_zipmap_entries这个值设置的很大，很多资料也推荐设置到1000，默认设置为了512，但是这里有个坑   #define ZIPMAP_BIGLEN 254 #define ZIPMAP_END 255     /* Return th
  • select into outfile access deny问题 daizj mysqltxt导出数据到文件
    本文转自：http://hatemysql.com/2010/06/29/select-into-outfile-access-deny%E9%97%AE%E9%A2%98/ 为应用建立了rnd的帐号，专门为他们查询线上数据库用的，当然，只有他们上了生产网络以后才能连上数据库，安全方面我们还是很注意的，呵呵。 授权的语句如下： grant select on armory.* to rn
  • phpexcel导出excel表简单入门示例 dcj3sjt126com PHPExcelphpexcel
    <?php error_reporting(E_ALL); ini_set('display_errors', TRUE); ini_set('display_startup_errors', TRUE);   if (PHP_SAPI == 'cli') die('This example should only be run from a Web Brows
  • 美国电影超短200句 dcj3sjt126com 电影
    1. I see． 我明白了。2. I quit! 我不干了!3. Let go! 放手!4. Me too． 我也是。5. My god! 天哪!6. No way! 不行!7. Come on． 来吧(赶快)8. Hold on． 等一等。9. I agree。 我同意。10. Not bad． 还不错。11. Not yet． 还没。12. See you． 再见。13. Shut up!
  • Java访问远程服务 dyy_gusi httpclientwebservicegetpost
        随着webService的崛起，我们开始中会越来越多的使用到访问远程webService服务。当然对于不同的webService框架一般都有自己的client包供使用，但是如果使用webService框架自己的client包，那么必然需要在自己的代码中引入它的包，如果同时调运了多个不同框架的webService，那么就需要同时引入多个不同的clien
  • Maven的settings.xml配置 geeksun settings.xml
    settings.xml是Maven的配置文件，下面解释一下其中的配置含义： settings.xml存在于两个地方： 1.安装的地方：$M2_HOME/conf/settings.xml 2.用户的目录：${user.home}/.m2/settings.xml 前者又被叫做全局配置，后者被称为用户配置。如果两者都存在，它们的内容将被合并，并且用户范围的settings.xml优先。
  • ubuntu的init与系统服务设置 hongtoushizi ubuntu
    转载自：  http://iysm.net/?p=178 init Init是位于/sbin/init的一个程序，它是在linux下，在系统启动过程中，初始化所有的设备驱动程序和数据结构等之后，由内核启动的一个用户级程序，并由此init程序进而完成系统的启动过程。 ubuntu与传统的linux略有不同，使用upstart完成系统的启动，但表面上仍维持init程序的形式。 运行
  • 跟我学Nginx+Lua开发目录贴 jinnianshilongnian nginxlua
    使用Nginx+Lua开发近一年的时间，学习和实践了一些Nginx+Lua开发的架构，为了让更多人使用Nginx+Lua架构开发，利用春节期间总结了一份基本的学习教程，希望对大家有用。也欢迎谈探讨学习一些经验。    目录 第一章 安装Nginx+Lua开发环境 第二章 Nginx+Lua开发入门 第三章 Redis/SSDB+Twemproxy安装与使用 第四章 L
  • php位运算符注意事项 home198979 位运算PHP&
    $a = $b = $c = 0; $a & $b = 1; $b | $c = 1  问a,b,c最终为多少?   当看到这题时，我犯了一个低级错误，误 以为位运算符会改变变量的值。所以得出结果是1 1 0 但是位运算符是不会改变变量的值的，例如： $a=1;$b=2; $a&$b;  这样a,b的值不会有任何改变
  • Linux shell数组建立和使用技巧 pda158 linux
    1.数组定义 　　[chengmo@centos5 ~]$ a=(1 2 3 4 5) 　　[chengmo@centos5 ~]$ echo $a 　　1 　　一对括号表示是数组，数组元素用“空格”符号分割开。 　　 2.数组读取与赋值 　　得到长度： 　　[chengmo@centos5 ~]$ echo ${#a[@]} 　　5 　　用${#数组名[@或
  • hotspot源码(JDK7) ol_beta javaHotSpotjvm
    源码结构图，方便理解：   ├─agent                            Serviceab
  • Oracle基本事务和ForAll执行批量DML练习 vipbooks oraclesql
    基本事务的使用： 从账户一的余额中转100到账户二的余额中去，如果账户二不存在或账户一中的余额不足100则整笔交易回滚 select * from account; -- 创建一张账户表 create table account( -- 账户ID id number(3) not null, -- 账户名称 nam
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他