个人博客系统重难点解析

1、个人博客系统重难点解析如何进行视频播放videoInfo.jsp<!-视频播放开始-> <video width="800" height="450"  controls="controls" preload="auto">               <source src="$resourcesUrl/upload/uplo

2、advideo/$video.videoPosition " type="video/ogg">               <source src="$resourcesUrl/upload/uploadvideo/$video.videoPosition " type="video/mp4">      &

3、#160;        <source src="$resourcesUrl/upload/uploadvideo/$video.videoPosition " type="video/webm">               <object data="movie.mp4" width="320&

4、quot; height="240">                 <embed width="800" height="450" src="$resourcesUrl/upload/uploadvideo/$video.videoPosition ">       

5、        </object>             </video><!-视频播放结束->针对个人信息修改功能如何实现页面标签效果personal.jsp<div role="content">    <div class="row"> &#

6、160;   <ul id="widget-tab-1" class="nav nav-tabs"      style="background-color: #fff;">      <li class="active"><a data-toggle="tab" href="#info">

7、<i        class="fa fa-lg fa-user"></i> <span class="h4">个人信息</span>      </a></li>      <li><a data-toggle="tab" href="

8、#avatar"> <i        class="fa fa-lg fa-image"></i> <span class="h4">博客头像</span></a></li>      <li><a data-toggle="tab" href="#password"&g

9、t; <i        class="fa fa-lg fa-bookmark"></i> <span class="h4">登录密码</span></a></li>      <li><a data-toggle="tab" href="#blogurl"> <i 

10、;       class="fa fa-lg fa-edit"></i> <span class="h4">博客地址</span></a></li>     </ul>    </div>    <div class=" padding-10"

11、; style="background-color: #fff;">     <form action="$base/user/updateUserInfo" method="post"      id="userForm" name="userForm" class="smart-form"     &#

12、160;enctype="multipart/form-data" novalidate="novalidate">      <!- 个人信息开始 ->      <c:forEach items="$userInfo" var="item">       <div class="

13、tab-content padding-top-10">        <div class="tab-pane fade in active" id="info">         <div class="row">         &#

14、160;<section class="col col-lg-2 col-md-2 col-sm-12 col-xs-12">           <strong>基本信息</strong>          </section>       

15、0; </div>         <div class="row">          <section class="col col-lg-3 col-md-3 col-sm-12 col-xs-12">         

16、0; <label class="label text-right"> 昵称： </label>          </section>          <section class="col col-lg-6 col-md-6 col-sm-12 col-xs-12">  &#

17、160;        <label class="input"> <span>$item.userName</span>           </label>          </section>  

18、60;      </div>         .   .        <!-个人信息结束->        <!- 头像开始 ->        <div

19、 class="tab-pane fade " id="avatar"         style="min-height: 500px;">         <div class="row" style="margin: 0px;">     

20、60;    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">           <fieldset>            <section class="col col-2"> &

21、#160;           <label class="label pull-right"><span              class="font-size-16">上传头像：</span></label>    

22、;        </section>            <section class="col col-6">             <div class="input input-file"

23、>              <span class="button"><input type="file"               id="coverlinkFile" name="coverlinkFile&

24、quot;               onchange="this.parentNode.nextSibling.value = this.value,PreviewImage(this)">Browse</span>              <input ty

25、pe="text"               placeholder="请选择本地图片，上传图片允许类型为.jpg .png" readonly="">              <input type="hidden&quo

26、t; id="avatar" name="avatar"               value="$item.avatar">             </div>      &#

27、160;     </section>           </fieldset>           <fieldset style="border-top: 1px dashed #E6E6E6;">      

28、;      <section class="col col-10">             <!- Widget ID (each widget will need unique ID)->             <div

29、class="jarviswidget jarviswidget-sortable"              id="wid-id-0" data-widget-togglebutton="false"              data-widget-ed

30、itbutton="false"              data-widget-fullscreenbutton="false"              data-widget-colorbutton="false"   &

31、#160;          data-widget-deletebutton="false" role="widget" style="">              <!- widget div->      

32、0;       <div role="content" style="border: 0px;">               <!- content ->             &

33、#160; <div id="myTabContent" class="tab-content">                <!- new tab: Aspect ratio ->               

34、 <div class="tab-pane fade active in" id="imgPreview">                 <img id="img1"              &#

35、160;   src="$resourcesUrl/upload/uploadimg/$item.avatar"                  class="superbox-current-img" alt="Jcrop Example"       &

36、#160;          width="300" height="300"                  style="width: 400px !important; height: 300px !important;">  

37、;              </div>               </div>              </div> 

38、;            </div>             <!- end widget ->            </section>    &#

39、160;      </fieldset>           <br />&nbsp;          </div>         </div>   

40、;     </div>        <!- 头像结束 ->        <!- 密码开始 ->        <div class="tab-pane fade" id="password"  

41、0;      style="min-height: 500px;">         <div class="row" style="margin: 0px;">          <div class="col-xs-12 col-sm-12 col-

42、md-12 col-lg-12">           <fieldset>            <section class="col col-2">             

43、<label class="label pull-right"><span              class="font-size-16">旧密码：</span></label>            </section> &

44、#160;          <section class="col col-6">             <label class="input"> <input type="password"       

45、;       class="input-lg" name="oldPass" id="oldPass"> <input              type="hidden" name="oldPassword" id="oldPassword" 

46、             value="$item.password">             </label>            </section> 

47、          </fieldset>           <fieldset style="border-top: 0px;">            <section class="col col-2&

48、quot;>             <label class="label pull-right"><span              class="font-size-16">新密码：</span></label> &#

49、160;          </section>            <section class="col col-6">             <label class="input

50、"> <input type="password"              class="input-lg" name="newPassword" id="newPassword">             </l

51、abel>            </section>           </fieldset>           <fieldset style="border-top: 0px"> 

52、;           <section class="col col-2">             <label class="label pull-right"><span         &#

53、160;    class="font-size-16">确认密码：</span></label>            </section>            <section class="col col-6">

54、60;            <label class="input"> <input type="password"              class="input-lg" name="passwordRe" id="pass

55、wordRe">             </label>            </section>           </fieldset>   

56、60;       <br />&nbsp;          </div>         </div>        </div>      

57、;  <!- 密码结束 ->        <!- 地址 ->        <div class="tab-pane fade" id="blogurl"         style="min-height: 500px;">

58、60;        <fieldset style="border-top: 0px;">          <section class="col col-2">           <label class="label p

59、ull-right"><span            class="font-size-16">博客名称：</span></label>          </section>          

60、;<section class="col col-6">           <label class="input"> <input type="text"            class="input-lg" id="blogName"

61、; name="blogName"            value="$item.blogName">           </label>          </section> 

62、60;       </fieldset>         <fieldset style="border-top: 0px;">          <section class="col col-2">     

63、      <label class="label pull-right"><span            class="font-size-16">博客地址：</span></label>          </secti

64、on>          <section class="col col-6">           <label class="input"> <input type="text"         &#

65、160;  class="input-lg" id="domain" name="domain"            value="$item.domain">           </label>    &#

66、160;     </section>         </fieldset>        </div>       </div>       <!- 地址 -> &#

67、160;    </c:forEach>      <footer class="btnArea">       <button type="submit" id="updateBtn" class="btn btn-primary">      

68、60; 提交</button>       <button type="reset" class="btn btn-default">重置</button>      </footer>     </form>    </div>   </div>如何实现图片列表的分页效果PhotoController.java/*  * Title: photoalbumlist  * Description: 根据专辑编号获取图片信