GBRSGB/CZKJ.GBRS2.WebMVC/Views/Video/Index.cshtml


@model IList<VideoEntity>
@section style{
    <link rel="stylesheet" href="@ConfigHelper.GetCDNPrefix()/assets/plugins/page/paging.css">
    <link rel="stylesheet" href="@ConfigHelper.GetCDNPrefix()/assets/css/video.css">
    <style>
        @@media(min-width:768px) {
            .m-header {
                height: 84px;
                display: block !important;
            }
        }
    </style>
}
<div class="container">
    <div class="video">
        <a class="back-nav">
            <i></i> 返回关于我们
        </a>
        <h2 class="list-title">国宝视频</h2>
        <div class="row">
            @foreach (var item in Model)
            {
                <div class="col-sm-4">
                    <a  href="javascript:void(0);" class="video-item" data-url="@item.Url">
                        <div class="img">
                            <img class="main-img hidden-xs" src="@item.Image" alt="@item.Name">
                            <img class="play hidden-xs" src="/assets/image/play.png" alt="">
                            <video class="visible-xs-inline-block" controls poster="@item.Image" src="@item.Url"></video>
                        </div>
                        <p title="@item.Description">@item.Description</p>
                    </a>
                </div>
            }
        </div>
        @if (Model.Count > 0)
        {
            <div class="pageDiv"></div>
        }

    </div>
</div>
<div class="foot-h"></div>
<div class="video-box">
    <div class="video">
        <video controls src="">
            您的浏览器不支持 video 标签,请升级更高版本浏览器观看！
        </video>
        <span class="close-video">✖</span>
    </div>
    <div class="video-mask"></div>
</div>
@section script{
    <script src="/assets/plugins/page/jquery.page.js"></script>
    <script>
        window.dataMark = "0$15231983314041342$$15231983816302510$";
        $(function () {
            $(".video-item").click(function () {
                //if ($(window).height() > 768) {
                    var video_url = $(this).attr("data-url");
                    $("video").attr("src", video_url);
                    $(".video-box").show();
                //}
            });
            $(".close-video,.video-mask").click(function () {
                $(".video-box").hide();
                $("video").attr("src", "");
            })
             //分页
            var pageSize = 6;
            var rowsCount = @(ViewBag.RowsCount);
            var pageIndex = @(ViewBag.PageIndex);
            $(".pageDiv").createPage({
                pageCount: Math.ceil(rowsCount / pageSize), //总页数
                current: pageIndex, //当前页
                turndown: 'false',
                backFn: function (p) {
                    pageIndex = p;
                    location.href = "@(Url.Action("Index", "Video"))?pageIndex=" + pageIndex + "&pageSize=" + pageSize;
                }
            });
        })
    </script>
}