jetty+bootstrap Carousel+springMVC+mybatis实现表格数据的轮播

最新推荐文章于 2023-11-12 11:00:19 发布
最新推荐文章于 2023-11-12 11:00:19 发布
阅读量2.9k 收藏 1
点赞数
分类专栏： 编程开发 软件 文章标签： bootstrap springMVC mybatis
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/tower888/article/details/45273433
版权



index.jsp

<%@ page language="java" pageEncoding="UTF-8"%>
<%@include file="/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@include file="/common/s.jsp"%>
<%@include file="/common/meta.jsp"%>

<title>首页</title>
</head>
<body class="login">
    <div class="box">
        <div class="content">
            <form id="login_form" class="form-horizontal" role="form" action="query/queryAll" style="width:320px;margin:0px auto;" method="post">
            
            <div class="form-group">  
                <div class="col-md-10">  
                    <button id="login" type="submit" class="btn btn-lg btn-primary btn-block">查询数据</button>
                </div>
            </div>
            </form>
       </div>
    </div>


</body>
</html>

leftrightTable.jsp 

<%@page import="com.asiainfo.lcims.bean.PageBean"%>
<%@page import="java.util.ArrayList"%>
<%@page import="com.asiainfo.lcims.po.MAdmin"%>
<%@page import="java.util.List"%>
<%@ page contentType="text/html;charset=UTF-8"%>
<%@include file="/taglibs.jsp"%>
<html>
<head>
<title>bootstrap表格数据左右轮播</title>
<%@include file="/common/s.jsp"%>
<%@include file="/common/meta.jsp"%>
<script>
    $(document).ready(function() {
        $('#carousel-ad').carousel({
            interval : 3000
        });
        
        // 初始化轮播
        $(".start-slide").click(function(){
           $("#myCarousel").carousel('cycle');
        });
        // 停止轮播
        $(".pause-slide").click(function(){
           $("#myCarousel").carousel('pause');
        });
        // 循环轮播到上一个项目
        $(".prev-slide").click(function(){
           $("#myCarousel").carousel('prev');
        });
        // 循环轮播到下一个项目
        $(".next-slide").click(function(){
           $("#myCarousel").carousel('next');
        });
    });
</script>
</head>

<body>
    <div id="myCarousel" class="carousel slide" data-ride="carousel">
        <div class="carousel-inner" role="listbox">
            <%! List<MAdmin> dataList = new ArrayList<MAdmin>();
                int totalRows = 1;//总行数
                int avgRows = 10;//每页行数
                int totalPage = 1;
                List<MAdmin> pageList = null;
                String item = "";%>
            <%
                dataList = (List<MAdmin>) request.getAttribute("dataList");
                totalRows = dataList.size();
                totalPage = totalRows / avgRows + (totalRows % avgRows > 0 ? 1 : 0);
            %>
            总记录数:<%=totalRows%>
            总页数:<%=totalPage%>
            <%
                for (int i = 1; i <= totalPage; i++) {
                    PageBean pb = new PageBean(i, avgRows, dataList);
                    pageList = pb.getPagerList();
                    if (i == 1) {
                        item = "item active";
                    } else {
                        item = "item";
                    }
            %>
            <div class="<%=item%>">
                <div>
                    <table class="table table-bordered">
                        <thead>
                            <tr>
                                <th style="width: 100px;">编号</th>
                                <th style="width: 100px;">用户名</th>
                                <th style="width: 150px;">状态</th>
                            </tr>
                        </thead>
                        <tbody>
                            <c:forEach items="<%=pageList%>" var="s" varStatus="i">
                                <tr>
                                    <td>${i.count}</td>
                                    <td>${s.admin}</td>
                                    <td>${s.status}</td>
                                </tr>
                            </c:forEach>
                        </tbody>
                    </table>
                </div>
                <div class="center">第[<%=i%>]页</div>
                <!-- 轮播（Carousel）导航 -->
                <a class="carousel-control left prev-slide" href="#" data-slide="prev">‹</a>
                <a class="carousel-control right next-slide" href="#" data-slide="next">›</a>
                
                 <!-- 控制按钮 -->
               <div style="text-align:center;">
                  <input type="button" class="btn btn-primary start-slide" value="开始">
                  <input type="button" class="btn btn-primary pause-slide" value="暂停">
                  <input type="button" class="btn btn-primary prev-slide" value="前一项">
                  <input type="button" class="btn btn-primary next-slide" value="后一项">
               </div>
            </div>
            <%
                }
            %>

        </div>
    </div>
</body>

</html>

springMVC controller:

LoginAction.java

package com.asiainfo.lcims.controller;

import java.util.List;

import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import com.asiainfo.lcims.bo.MAdminBO;
import com.asiainfo.lcims.po.MAdmin;

@Controller
@RequestMapping("/query")
public class LoginAction {
    private static final Logger log = LoggerFactory.getLogger(LoginAction.class);
    @Resource(name = "mAdminBO")
    private MAdminBO mAdminBO;

    /**
     * 信息查询
     *
     * @author zhaigx
     */
    @RequestMapping("/queryAll")
    public String queryAll(HttpServletRequest request, Model model) {
        log.info("start query....");
        String url = null;
        try {
            List<MAdmin> ret = mAdminBO.queryAll();
            if (ret != null) {
                log.info("query size:{}", ret.size());
                url = "/jsp/leftrightTable.jsp";
                model.addAttribute("dataList", ret);
                return url;
            }
        } catch (Exception e) {
            log.error("", e);
        }
        return "/error.jsp";
    }


}

BO: 

package com.asiainfo.lcims.bo;

import java.util.List;

import javax.annotation.Resource;

import org.springframework.stereotype.Service;

import com.asiainfo.lcims.mapper.MAdminDAO;
import com.asiainfo.lcims.po.MAdmin;

@Service("mAdminBO")
public class MAdminBO {
    @Resource(name = "mAdminDAO")
    private MAdminDAO mAdminDAO;


    public List<MAdmin> queryAll() {
        List<MAdmin> list = mAdminDAO.queryAll();
        return list;
    }
}

DAO: 

package com.asiainfo.lcims.mapper;

import java.util.List;

import org.springframework.stereotype.Repository;

import com.asiainfo.lcims.po.MAdmin;

@Repository(value = "mAdminDAO")
public interface MAdminDAO {

    public List<MAdmin> queryAll();
}

PageBean:

package com.asiainfo.lcims.bean;

import java.util.ArrayList;
import java.util.List;

public class PageBean<T> {
    /**
     * 当前页码
     */
    private int currentPage;
    /**
     * 总页数
     */
    private int totalPage;
    /**
     * 总行数
     */
    private int totalRows;
    /**
     * 每页显示条数
     */
    private int avgRows = 5;
    /**
     * 原集合
     */
    private List<T> list;

    public PageBean(int currentPage, int avgRows, List<T> list) {
        super();
        this.currentPage = currentPage;
        this.avgRows = avgRows;
        this.list = list;
        this.totalRows = list.size();
        this.totalPage = (this.totalRows - 1) / this.avgRows + 1;
    }

    public List<T> getPagerList() {
        List<T> newList = new ArrayList<T>();
        for (int i = (currentPage - 1) * avgRows; i < totalRows && i < currentPage * avgRows; i++) {
            newList.add(list.get(i));
        }
        return newList;
    }

    public int getCurrentPage() {
        return currentPage;
    }

    public void setCurrentPage(int currentPage) {
        this.currentPage = currentPage;
    }

    public int getTotalPage() {
        return totalPage;
    }

    public void setTotalPage(int totalPage) {
        this.totalPage = totalPage;
    }

    public int getAvgRows() {
        return avgRows;
    }

    public void setAvgRows(int avgRows) {
        this.avgRows = avgRows;
    }

    public int getTotalRows() {
        return totalRows;
    }

    public void setTotalRows(int totalRows) {
        this.totalRows = totalRows;
    }

    public List<T> getList() {
        return list;
    }

    public void setList(List<T> list) {
        this.list = list;
    }
}



mybatis mapper配置：

<?xml version="1.0" encoding="UTF-8" ?>    
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.asiainfo.lcims.mapper.MAdminDAO">
    <select id="queryAll"  resultType="M_ADMIN_ALIAS">
        select * from M_ADMIN
    </select>
</mapper>

applicationContext.xml: 

<?xml version="1.0" encoding="UTF-8" ?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context"
    xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
    xsi:schemaLocation="http://www.springframework.org/schema/beans
	http://www.springframework.org/schema/beans/spring-beans-3.0.xsd 
	http://www.springframework.org/schema/context
	http://www.springframework.org/schema/context/spring-context-3.0.xsd 
	http://www.springframework.org/schema/tx
	http://www.springframework.org/schema/tx/spring-tx-3.0.xsd 
	http://www.springframework.org/schema/aop
	http://www.springframework.org/schema/aop/spring-aop-3.0.xsd">
    <context:annotation-config />
    <!-- 扫描service,dao组件 -->
    <context:component-scan base-package="com.asiainfo.lcims.bo,com.asiainfo.lcims.mapper" />

    <bean id="dataSource" class="com.alibaba.druid.pool.DruidDataSource">
        <property name="driverClassName" value="oracle.jdbc.driver.OracleDriver" />
        <property name="url" value="jdbc:oracle:thin:@127.0.0.1:17520:test" />
        <property name="username" value="test123" />
        <property name="password" value="test123" />
        <property name="initialSize" value="0" />
        <property name="maxActive" value="20" />
        <property name="minIdle" value="0" />
        <property name="maxWait" value="60000" />
        <property name="validationQuery">
            <value>SELECT 1 from dual</value>
        </property>
        <property name="testOnBorrow" value="false" />
        <property name="testOnReturn" value="false" />
        <property name="testWhileIdle" value="true" />
        <property name="timeBetweenEvictionRunsMillis" value="60000" />
        <property name="minEvictableIdleTimeMillis" value="25200000" />
        <property name="removeAbandoned" value="true" />
        <property name="removeAbandonedTimeout" value="1800" />
        <property name="logAbandoned" value="true" />
        <property name="filters" value="stat" />
    </bean>


    <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
        <property name="dataSource" ref="dataSource" />
        <property name="configLocation" value="classpath:mybatis-conf.xml"></property>
    </bean>

    <!-- DAO接口所在包名，Spring会自动查找其下的类 -->
    <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
        <property name="basePackage" value="com.asiainfo.lcims.mapper" />
    </bean>

    <bean id="transactionManager"
        class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
        <property name="dataSource" ref="dataSource" />
    </bean>
    <!-- 声明式事务 -->
    <tx:annotation-driven transaction-manager="transactionManager"
        proxy-target-class="true" />
    <tx:advice id="txAdvice" transaction-manager="transactionManager">
        <tx:attributes>
            <tx:method name="delete*" propagation="REQUIRED"
                read-only="false" rollback-for="java.lang.Exception"
                no-rollback-for="java.lang.RuntimeException" />
            <tx:method name="rm*" propagation="REQUIRED"
                read-only="false" rollback-for="java.lang.Exception"
                no-rollback-for="java.lang.RuntimeException" />
            <tx:method name="insert*" propagation="REQUIRED"
                read-only="false" rollback-for="java.lang.RuntimeException" />
            <tx:method name="add*" propagation="REQUIRED"
                read-only="false" rollback-for="java.lang.RuntimeException" />
            <tx:method name="save*" propagation="REQUIRED"
                read-only="false" rollback-for="java.lang.RuntimeException" />
            <tx:method name="update*" propagation="REQUIRED"
                read-only="false" rollback-for="java.lang.Exception" />
            <tx:method name="mod*" propagation="REQUIRED"
                read-only="false" rollback-for="java.lang.Exception" />
            <tx:method name="find*" propagation="SUPPORTS" />
            <tx:method name="get*" propagation="SUPPORTS" />
            <tx:method name="select*" propagation="SUPPORTS" />
            <tx:method name="query*" propagation="SUPPORTS" />
        </tx:attributes>
    </tx:advice>
    <!-- 把事务控制在Service层 -->
    <aop:config>
        <aop:pointcut id="pc"
            expression="execution(* com.asiainfo.lcims.bo.*.*(..))" />
        <aop:advisor pointcut-ref="pc" advice-ref="txAdvice" />
    </aop:config>

</beans>

springmvc-servlet.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:mvc="http://www.springframework.org/schema/mvc"
    xmlns:context="http://www.springframework.org/schema/context"
    xsi:schemaLocation="http://www.springframework.org/schema/beans
       http://www.springframework.org/schema/beans/spring-beans.xsd
       http://www.springframework.org/schema/mvc
       http://www.springframework.org/schema/mvc/spring-mvc.xsd
       http://www.springframework.org/schema/context
       http://www.springframework.org/schema/context/spring-context.xsd
       ">

    <mvc:annotation-driven />
    <!-- 自动扫描该包，使SpringMVC认为包下用了@controller注解的类是控制器 -->
    <context:component-scan base-package="com.asiainfo.lcims.controller" >
        <!-- <context:include-filter type="annotation" expression="org.springframework.stereotype.Controller" /> -->
    </context:component-scan>
    
    <mvc:default-servlet-handler/>
    
    <!-- <mvc:resources location="/css" mapping="/css/**" /> <mvc:resources 
        location="/images" mapping="/images/**" /> <mvc:resources location="/js" 
        mapping="/js/**" /> -->

    <!-- Spring MVC JSON配置 -->
    <bean id="mappingJacksonHttpMessageConverter"
        class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter">
        <property name="supportedMediaTypes">
            <list>
                <value>text/html;charset=UTF-8</value>
            </list>
        </property>
    </bean>

    <!-- 启动Spring MVC的注解功能，完成请求和注解POJO的映射 -->
    <bean
        class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">
        <property name="messageConverters">
            <list>
                <!-- json转换器 -->
                <ref bean="mappingJacksonHttpMessageConverter" />
            </list>
        </property>
    </bean>


    <!-- 对模型视图名称的解析，即在模型视图名称添加前后缀 -->
    <!-- <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver"> 
        <property name="prefix" value="/"></property> <property name="suffix" value=".jsp"></property> 
        </bean> -->
</beans>

mybatis-conf.xml 

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE configuration
PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
    <settings>
        <!-- 设置但JDBC类型为空时,某些驱动程序 要指定值,default: OTHER -->
        <setting name="jdbcTypeForNull" value="NULL" />
    </settings>
    <typeAliases>
        <typeAlias alias="M_ADMIN_ALIAS" type="com.asiainfo.lcims.po.MAdmin" />
    </typeAliases>
    <mappers>
        <mapper resource="mapper/M_ADMIN.xml" />
    </mappers>
</configuration>

web.xml: 

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee 
    http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">

    <welcome-file-list>
        <welcome-file>index.jsp</welcome-file>
    </welcome-file-list>
    <!-- 配置 Spring -->
    <context-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>classpath:applicationContext.xml</param-value>
    </context-param>
    <listener>
        <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
    </listener>
    <!-- 配置springmvc -->
    <servlet>
        <servlet-name>dispatcher</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:springmvc-servlet.xml</param-value>
        </init-param>
    </servlet>
    <servlet-mapping>
        <servlet-name>dispatcher</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>

    <mime-mapping>
        <extension>wsdl</extension>
        <mime-type>text/xml</mime-type>
    </mime-mapping>
    <mime-mapping>
        <extension>xsd</extension>
        <mime-type>text/xml</mime-type>
    </mime-mapping>
    <mime-mapping>
        <extension>tex</extension>
        <mime-type>application/x-tex</mime-type>
    </mime-mapping>
    <mime-mapping>
        <extension>tar</extension>
        <mime-type>application/x-tar</mime-type>
    </mime-mapping>
    <mime-mapping>
        <extension>txt</extension>
        <mime-type>application/octet-stream</mime-type>
    </mime-mapping>
    <mime-mapping>
        <extension>gz</extension>
        <mime-type>application/x-gzip</mime-type>
    </mime-mapping>
    <error-page>
        <exception-type>javax.servlet.ServletException</exception-type>
        <location>/error.jsp</location>
    </error-page>
    <error-page>
        <error-code>500</error-code>
        <location>/error.jsp</location>
    </error-page>

    <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.css</url-pattern>
    </servlet-mapping>

    <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.js</url-pattern>
    </servlet-mapping>

    <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.gif</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.jpg</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.png</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.ico</url-pattern>
    </servlet-mapping>
    <servlet-mapping>
        <servlet-name>default</servlet-name>
        <url-pattern>*.map</url-pattern>
    </servlet-mapping>
</web-app>

启动类： 

package com.asiainfo.lcims.server;

import org.eclipse.jetty.server.Connector;
import org.eclipse.jetty.server.Server;
import org.eclipse.jetty.server.nio.SelectChannelConnector;
import org.eclipse.jetty.util.thread.QueuedThreadPool;
import org.eclipse.jetty.webapp.WebAppContext;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;

import com.asiainfo.lcims.config.SysConfig;

public class MainServer {
    private static final Logger log = LoggerFactory.getLogger(MainServer.class);
    public static void main(String[] args) {
        SysConfig conf = new SysConfig();
        try {
            Server server = new Server();
            int port = conf.getServerPort();
            log.info("Server start : port:{}", port);
            SelectChannelConnector connector = new SelectChannelConnector();
            connector.setPort(port);
            connector.setMaxIdleTime(30000);
            connector.setRequestHeaderSize(8192);
            QueuedThreadPool threadPool = new QueuedThreadPool(20);
            threadPool.setName("embed-jetty-http");
            connector.setThreadPool(threadPool);
            server.setConnectors(new Connector[] { connector });

            WebAppContext ctx = new WebAppContext();
            ctx.setContextPath("/");
            ctx.setResourceBase(conf.getResourceBase());
            server.setHandler(ctx);
            server.setStopAtShutdown(true);

            server.start();
            server.join();
        } catch (Exception e) {
            log.error("", e);
        }

    }
}

引入的js: 

<%@page language="java" pageEncoding="UTF-8"%>

<link href="${ctx}/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="${ctx}/css/flexslider.css" rel="stylesheet" type="text/css" />
<link href="${ctx}/css/lcims.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="${ctx}/js/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="${ctx}/js/bootstrap.min.js"></script>


tower888
关注
专栏目录
基于Jetty+Servlet+Jsp+MySQL+MyBatis技术实现的简单博客系统
10-19
本博客系统主要使用Jetty技术+Servlet技术+Jsp技术+BootStrap前端框架+wangEditor富文本编辑器+MySQL数据库+MyBatis持久层，通过对该系统的设计，可以在实践过程中掌握相关基础知识，如对三层架构开发模式的熟悉、...
boostrap 轮播 carousel(旋转木马)
往前的娘娘
06-28 8029
效果： 图片轮播 准备工作：用js生成图片这里用的是placeholder.js 网址为：https://github.com/hustcc/placeholder.js.git 在gist 获取 placeholder.js引入工程中 总结： 1、class="carousel slide" 表示轮播，有滑动
bootstrap网页排版的优化
weixin_67235801的博客
05-10 733
bootstrap，界面优化增加组件
深入拆解Tomcat&Jetty(七)
r09er的博客
04-04 448
回顾一下Tomcat的启动步骤 1.安装JDK,配置环境变量 2.下载Tomcat并解压 3.执行tomcat/bin目录下的start.sh 执行脚本后的流程 image 1.Tomcat本质上还是一个Java程序,因此startup.sh脚本会启动一个JVM来运行Tomcat的启动类BootStrap 其实Tomcat和我们自己平时写的代码并没有本质上的...
Bootstrap 5笔记
最新发布
fwq0611的博客
11-12 1350
关闭提示框：我们可以在提示框中的 div 中添加 .alert-dismissible 类，然后在关闭按钮的链接上(button type=“button”)添加 class=“btn-close” 和 data-bs-dismiss=“alert” 类来设置提示框的关闭操作。div元素上添加 .dropdown-menu 类来设置实际下拉菜单，然后在下拉菜单的选项中添加 .dropdown-item 类。内边距：.pt-5 边框：.border 背景颜色：.bg-dark (文本：text-)
Vue之表格循环播放（滚动播放列表）
xla_java的博客
08-01 3282
无额外组件，实现el-table滚动效果，紧急插入效果，鼠标进出暂停效果。本篇有两种显示效果，一种是不显示颜色，就会显示透明的表格背景。另一种就是显示颜色，根据不同的数据显示不同的style样式。里面还有一点，根据不同数据，显示不同样式。
springboot+mybatis+bootstrap整合的简单框架
10-11
本项目"springboot+mybatis+bootstrap整合的简单框架"旨在提供一个快速开发的解决方案，将三个流行的开源技术——Spring Boot、MyBatis和Bootstrap融合在一起，以简化Web应用的构建过程。 Spring Boot是由Pivotal...
SSM整合图书管理系统 idea+Maven+Spring+SpringMVC+Mybatis
04-02
SSM整合指的是Spring、SpringMVC和Mybatis三个框架的集成，这在Java Web开发中是一种常见的技术栈，尤其适用于构建复杂的企业级应用，如图书管理系统。Idea是一款流行的Java集成开发环境，而Maven是项目管理和依赖...
springMVC注解+mybatis+bootstrap
02-19
标题 "springMVC注解+mybatis+bootstrap" 暗示了这是一个使用Spring MVC作为控制器层、MyBatis作为数据访问层，并结合Bootstrap作为前端界面框架的Web应用程序。这样的组合常见于现代Java Web开发中，它提供了强大的...
SpringBoot + Mybatis + bootstrap+mysql实现的二手市场系统源码
06-23
总的来说，这个二手市场系统利用SpringBoot的自动化配置和内嵌的Servlet容器简化了后端开发，Mybatis提供了灵活的数据访问层，Bootstrap则让前端界面更加美观且适应各种屏幕尺寸，而MySQL作为可靠的数据库，确保了...
Bootstrap快速入门之轮播效果&列表组&画像（图文框）&表单
m0_67768699的博客
05-02 1879
案例1：首页轮播图实现 1.什么是轮播效果(Carousel) 2.轮播效果的工作原理 3.包含字幕的轮播示例 案例2：首页书籍分类实现 1.什么是列组表 2..active列表(启用)状态示例 案例3：首页新书上架&热门书籍实现 1.什么是图文框 2.图文框示例 案例4：首页整合 案例5：实现登录&注册页面 1.Forms表单 2.Forms表单示例
Netty4学习笔记（2）-- Bootstrap
热门推荐
zxh的专栏
12-19 1万+
介绍Netty4 Bootstrap类
实现表格数据纵向轮播滚动样式（包括nav-tabs选项卡放三表方法）
hexianfan的博客
06-05 730
本文用到的是三张表同时滚动，并且只在数据大于4条时才进行滚动，数据太少容易有衔接空隙，当鼠标放到表格上时，数据停止滚动，移除鼠标继续滚动。 CSS部分 .gslscrollcss { background-color: #FFFFFF; border: solid 1px white; width: auto; height: 198px; } /*控制表格宽度*/ .tablebox { /*控制滚动区域高度*/ height: 198px; ov
表格数据轮播
山谷里的杂货铺
08-24 1578
方案一：采用vue-seamless-scroll无缝滚动 1、安装 npm install vue-seamless-scroll --save　 2、引入组件 <vue-seamless-scroll></vue-seamless-scroll> import vueSeamlessScroll from 'vue-seamless-scroll' components: { vueSeamlessScroll }, 3、使用 表头： ..
echarts表格数据轮播展示
qq_33404590的博客
02-06 1421
echarts表格数据轮播展示。
Angular引入ant.desigin的Transfer穿梭框和轮播图carousel，【更新】穿梭框数据大表格渲染支持搜索
几百块的博客
08-09 1059
ant.desigin是根据列表内的direction字段去区分当前数据在左侧还是右侧，值为left在左侧，right在右侧。以上就是Angular引入ant.desigin的Transfer穿梭框和轮播图carousel的全部内容，比较简单。引入后 在class里面定义该列表，并定义其刚刚引入的类型。轮播图就比较简单了 官网有对应的案例，这里只做简单的记录。注意的是列表页面请求回来之后，需要手动赋值一下。...
jq实现表格轮播滚动——技能提升
yehaocheng520的博客
08-25 1693
今天在做电视机的项目，除了单位要转为自适应的rem之外，还有一个点就是表格要实现轮播。 效果图如上，表格中是一条条的数据，需要实现表格中的数据向上滚动，每次滚动的就是一行数据的高度。 我的jq技能几乎忘光了，下面附录同事的代码： setInterval(timerFn,3000); function timerFn() { var scrollHeight = $(".order-table").find("tr").outerHeight(); $(".order-table").ani
springboot+mybatis-plus 实现轮播图的查询
Jie1104的博客
10-21 1056
对mybatis-plus的学习
bootstrap轮播图&表格
weixin_60305751的博客
04-30 739
一、我们先来讲一下轮播图 （自动轮播哦）非常容易 大家可以直接copy我下面的代码 在img那里加上你需要的图片即可 <li>标签 就是效果图上的点点 加了图片记得加一个点哦 <div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel"> <ol class="carousel-indicators"> <li data-target="#carous...
学生信息管理系统：Spring + SpringMvc + MyBatis实现
资源摘要信息:"基于Spring + SpringMvc + MyBatis搭建的学生信息管理系统.zip" 本资源描述了一个使用Java语言开发的学生信息管理系统，系统采用了当前流行的Spring、SpringMvc和MyBatis框架进行搭建。这些技术的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值