- <style type="text/css">
- /* 图片新闻大小可以更改此样式 */
- .pp_portal_imgNews {
- position:relative;
- text-align:left;
- width:250px;
- height:190px;
- }
- .pp_portal_imgNew {
- position:absolute;
- }
- /* 图片样式 */
- .pp_portal_imgNew img {
- width:100%;
- height:165px;
- border:0;
- }
- /* 文字标题样式 */
- .pp_portal_imgNew_title {
- text-align:center;
- margin-top:5px;
- }
- .pp_portal_imgNew_title a{
- display:block;
- color:#000;
- text-decoration: none;
- font-size: 14px;
- font-weight: bold;
- text-align:center;
- }
- /* 导航提示位置 */
- .pp_portal_navLink {
- position:absolute;
- display:block;
- right:0px;
- bottom:5px;
- }
- /* 导航提示样式(未选择) */
- .pp_portal_navLink a {
- color:#fff;
- text-align:center;
- text-decoration: none;
- }
- .pp_portal_navLink li {
- display:inline;
- text-align:center;
- background-color:#333;
- width:15px;
- margin-left:1px;
- }
- </style>
- <script type="text/javascript">
- var newsNum = 4;
- var nn = 1;
- function pp_portal_selectPicNew(o) {
- for(var i=1; i<=newsNum; i++) {
- var newsId = "id_portal_imgNew" + i;
- if(o==i) { // 被选中
- document.getElementById(newsId).style.display="block";
- document.getElementById("id_portal_navLink"+i).style.background="red";
- } else {
- document.getElementById(newsId).style.display="none";
- document.getElementById("id_portal_navLink"+i).style.background="#333";
- }
- }
- nn=o;
- }
- // 自动选择图片新闻
- function pp_portal_changePicNew()
- {
- if(nn>newsNum) nn=1
- //alert(nn);
- pp_portal_selectPicNew(nn);
- nn++;
- }
- function pp_portal_picNew_auto() {
- pp_portal_picNew_autoTask = setInterval('pp_portal_changePicNew()', 2000);
- }
- pp_portal_picNew_auto();
- </script>
- <div id="id_portal_imgNews" class="pp_portal_imgNews">
- <div id="id_portal_imgNew1" class="pp_portal_imgNew" style="display:block;">
- <a href="#"><img alt="图片新闻一" src="http://i3.sinaimg.cn/ty/f1/2008-10-11/U1166P6T12D4001153F1286DT20081011142406.jpg"></img></a>
- <div class="pp_portal_imgNew_title"><a href="http://sports.sina.com.cn/f1/2008-10-11/14014001153.shtml">图片新闻一</a></div>
- </div>
- <div id="id_portal_imgNew2" class="pp_portal_imgNew" style="display:none;">
- <a href="#"><img alt="图片新闻二" src="http://i3.sinaimg.cn/ty/f1/2008-10-11/U1166P6T12D4001153F1286DT20081011142406.jpg"></img></a>
- <div class="pp_portal_imgNew_title"><a href="http://sports.sina.com.cn/f1/2008-10-11/14014001153.shtml">图片新闻二</a></div>
- </div>
- <div id="id_portal_imgNew3" class="pp_portal_imgNew" style="display:none;">
- <a href="#"><img alt="图片新闻三" src="http://i3.sinaimg.cn/ty/f1/2008-10-11/U1166P6T12D4001153F1286DT20081011142406.jpg"></img></a>
- <div class="pp_portal_imgNew_title"><a href="http://sports.sina.com.cn/f1/2008-10-11/14014001153.shtml">图片新闻三</a></div>
- </div>
- <div id="id_portal_imgNew4" class="pp_portal_imgNew" style="display:none;">
- <a href="#"><img alt="图片新闻四" src="http://i3.sinaimg.cn/ty/f1/2008-10-11/U1166P6T12D4001153F1286DT20081011142406.jpg"></img></a>
- <div class="pp_portal_imgNew_title"><a href="http://sports.sina.com.cn/f1/2008-10-11/14014001153.shtml">图片新闻四</a></div>
- </div>
- <div id="id_portal_navLinks" class="pp_portal_navLink">
- <ul>
- <li id="id_portal_navLink1" ><a href="javascript:void(0)" οnclick="pp_portal_selectPicNew(1)"> 1 </a></li>
- <li id="id_portal_navLink2" ><a href="javascript:void(0)" οnclick="pp_portal_selectPicNew(2)"> 2 </a></li>
- <li id="id_portal_navLink3" ><a href="javascript:void(0)" οnclick="pp_portal_selectPicNew(3)"> 3 </a></li>
- <li id="id_portal_navLink4" ><a href="javascript:void(0)s" οnclick="pp_portal_selectPicNew(4)"> 4 </a></li>
- </ul>
- </div>
- </div>
效果预览