热门关键字:
jquery > jquery教程 > jquery教程 > jquery ui tabs使用心得

jquery ui tabs使用心得

354
作者:管理员
发布时间:2021/1/26 15:59:44
评论数:0
转载请自觉注明原文:http://www.jq-school.com/Show.aspx?id=3475
首先:先下载在jqueryui tabs文件,我的是jquery-ui-1.10.4.custom;


第二步:参照demo在jsp页面仿写


内容如下:


<%@ page language="java"import="java.util.*" pageEncoding="ISO-8859-1"%>


<%


String path =request.getContextPath();


String basePath =request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";


%>


<!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.01 Transitional//EN">


 


<html>


  <head>


    <base href="<%=basePath%>">


        <link rel="stylesheet" href="<%=path%>/js/jquery-ui/development-bundle/themes/base/jquery.ui.all.css">


       <link rel="stylesheet"href="<%=path%>/js/jquery-ui/css/jquery-ui-1.10.4.custom.css">


       <script src="<%=path%>/js/jquery-ui/js/jquery-1.10.2.js"></script>


       <script src="<%=path%>/js/jquery-ui/jquery-ui.custom.js"></script>


       <link rel="stylesheet"href="<%=path%>/js/jquery-ui/development-bundle/demos/demos.css">


 


  </head>


 


  <body>


    <div id="tabs">


    <ul>


       <li><a href="#tabs-1">tab1</a></li>


       <li><a href="#tabs-2">tab2</a></li>


       <li><a href="#tabs-3">tab3</a></li>


    </ul>


    <div id="tabs-1">


       111111111111111111111111111111111111111111111111111


    </div>


    <div id="tabs-2">


       22222222222222222222222222222


    </div>


    <div id="tabs-3">


       3333333333333333333333333333333333


    </div>


</div>


   


  </body>


</html>








如果您觉得本文的内容对您的学习有所帮助:支付鼓励



关键字:jQuery
友荐云推荐