<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jQuery新闻列表滚动下一级代码 - 网页模板</title>
<link href='http://fonts.googleapis.com/css?family=Ubuntu:400,700&subset=latin-ext' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/ideaboxNews.css">
<link rel="stylesheet" type="text/css" href="css/jquery.mCustomScrollbar.min.css">
<script src="js/jQuery.js"></script>
<script src="js/jquery.mCustomScrollbar.min.js"></script>
</head>
<style>
body{font-family:Ubuntu, Arial, Helvetica, sans-serif; font-size:16px; font-weight:400; padding:0; margin:0; }
.container{width:30%; height:auto; margin:100px auto 0 auto;}
header{width:100%; min-height:100px; padding:20px; background:url(trash/bgnoise_lg.png); text-align:center; border-bottom:solid 2px #333; box-sizing:border-box;}
header h1{font-weight:normal; font-size:36px; padding:0; margin:0;}
header h3{padding:0; margin:0;}
header .examples{width:100%; height:auto; padding:20px 0;}
header .examples a{display:inline-block; padding:10px 20px; background:#333; text-decoration:none; color:#FFF;}
header .examples a.active{background:#C00;}
.example_img{width:100%; text-align:center; padding:20px; box-sizing:border-box; background:#333; margin-top:50px;}
.example_img img{display:inline-block;}
</style>
<body>
<div class="container">
<div class="ideaboxNews in-easing" id="idx1">
<!--<h3>LATEST NEWS</h3>-->
<ul>
<li>
<div class="in-image">
<img src="trash/img1.jpg">
<span class="in-red"><h6>Read more</h6></span>
</div>
<div class="in-content">
<h2>LOREM IPSUM DOLAR</h2>
<span>10 APRIL 2015, SUNDAY</span>
<div>
111Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident</p>
</div>
</div>
</li>
<li>
<div class="in-image">
<img src="trash/img3.jpg">
<span class="in-turquoise"><h6>Read more</h6></span>
</div>
<div class="in-content">
<h2>SIT AMET</h2>
<span>11 APRIL 2015, SUNDAY</span>
<div>
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
</div>
</div>
</li>
<li>
<div class="in-image">
<img src="trash/img7.jpg">
<span class="in-yellow"><h6>Read more</h6></span>
</div>
<div class="in-content">
<h2>text of the printing</h2>
<span>12 APRIL 2015, SUNDAY</span>
<div>
Aenean id rutrum libero, eu elementum enim. Quisque cursus mattis velit. Donec ac ex luctus, blandit ante vel, feugiat magna. Maecenas vitae nisi nulla.<br><br> Sed nibh risus, maximus in imperdiet in, auctor eget nisl. Nullam venenatis ac nunc a feugiat. Pellentesque nulla est, scelerisque id ligula non, convallis euismod odio. Proin tortor est, tincidunt ac libero consequat, venenatis pulvinar purus. Maecenas a feugiat velit<
/div>
</div>
</li>
<li>
<div class="in-image">
<img src="trash/img2.jpg">
<span class="in-blue"><h6>Read more</h6></span>
</div>
<div class="in-content">
<h2>ARE MANY VARIATIONS</h2>
<span>13 APRIL 2015, SUNDAY</span>
<div>
Maecenas vitae nisi nulla. Sed nibh risus, maximus in imperdiet in, auctor eget nisl. Nullam venenatis ac nunc a feugiat. <br><br>Pellentesque nulla est, scelerisque id ligula non, convallis euismod odio. Proin tortor est, tincidunt ac libero consequat, venenatis pulvinar purus. <br><br>Maecenas a feugiat velit. Aliquam quis sodales ligula, id rhoncus purus. Morbi ac justo ut eros lacinia volutpat. Donec id vestibulum lectus. Cras vitae velit mauris. Sed dignissim luctus tristique. Vivamus augue odio, ullamcorper egestas risus a, convallis ultricies velit.
</div>
</div>
</li>
<li>
<div class="in-image">
<img src="trash/img8.j
jQuery新闻列表滚动下一级代码.zip
版权申诉
91 浏览量
2022-11-22
17:16:08
上传
评论
收藏 355KB ZIP 举报
jQuery新闻列表滚动下一级代码.zip （27个子文件） 
jQuery新闻列表滚动下一级代码 jiaoben3311 css 
ideaboxNews.css 5KB jquery.mCustomScrollbar.min.css 42KB img 
in-close-icon.png 443B mCSB_buttons.png 3KB
index.html 20KB js jquery.mCustomScrollbar.min.js 39KB jQuery.js 95KB trash 
img18.jpg 30KB img9.jpg 8KB img1.jpg 4KB bgnoise_lg.png 5KB img14.jpg 7KB img17.jpg 9KB img10.jpg 32KB img2.jpg 6KB relative_examples.jpg 81KB img13.jpg 7KB img19.jpg 7KB img8.jpg 4KB img11.jpg 24KB img7.jpg 17KB img16.jpg 8KB img12.jpg 17KB img3.jpg 36KB img6.jpg 15KB img15.jpg 41KB jQuery新闻列表滚动下一级代码.jpg 56KB资源评论
