123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100 |
- <!DOCTYPE html>
- <html>
- <head>
- <title>文章教程-帮助中心-星优办公软件</title>
- @include('home.http.common.head')
- <link href="/static/css/jquery.page.css" rel="stylesheet" type="text/css">
- <script src="/static/js/jquery.js"></script>
- <script src="/static/js/jquery.page.js"></script>
- </head>
- <body>
- <div class="header">
- @include('home.http.common.header')
- </div>
- <div style="height: 68px;"></div>
- <div id="app">
- <!--- 解决方案 --->
- <div class="index-about" style="padding-top: 40px;">
- <div class="width-1200">
- <div class="flex-start">
- <div class="about-list">
- @foreach ($list as $item)
- <div class="about-item">
- <div class="i-time">
- <a href="{{ url('/news/detail/' . $item->mid) }}">
- @if ($item->logo)
- <img src="{{ $item->logo }}" class="new-img" />
- @else
- <img src="/static/images/about-img2.jpg" class="new-img" />
- @endif
- </a>
- </div>
- <div class="i-content">
- <a href="{{ url('/news/detail/' . $item->mid) }}">
- <p class="i-title overflow">{{ $item->title }}</p>
- <p class="i-desc more-overflow">{{ $item->introduction }}</p>
- </a>
- </div>
- </div>
- @endforeach
- <div id="page"></div>
- </div>
- <div class="about-detail">
- <div class="about-area">
- <div class="about-title">文章分类</div>
- @foreach ($category as $item)
- @if($item->id < 17)
- <div class="news-item">
- <a href="{{ url('/news/category/' . $item->mid . '?page=1') }}"
- target="_blank">{{ $item->name }}</a>
- </div>
- @endif
- @endforeach
- </div>
- </div>
- </div>
- </div>
- </div>
- @include('home.http.common.footer')
- </div>
- </body>
- <script>
- let total = Number ({{ $total }});
- let totalPage = Math.ceil(total / 15);
- let currentUrl = window.location.href;
- let url = new URL(currentUrl);
- let currentPage = url.searchParams.get("page") ?? 1;
- setTimeout(function() {
- $("#page").Page({
- totalPages: totalPage, //total Pages
- liNums: 10, //the li numbers(advice use odd)
- activeClass: 'activP', //active class style
- firstPage: '首', //first button name
- lastPage: '末', //last button name
- prv: '<', //prev button name
- next: '>', //next button name
- hasFirstPage: true, //whether has first button
- hasLastPage: true, //whether has last button
- hasPrv: true, //whether has prev button
- hasNext: true, //whether has next button
- callBack: function(_page) {
- url.searchParams.set('page', _page);
- window.location.href = url.href;
- }
- });
- $('.pagingUl li a').each((index, item) => {
- $(item).removeClass('activP');
- let num = $(item).text();
- if(num == currentPage){
- $(item).addClass('activP');
- }
- })
- }, 100)
- </script>
- </html>
|