腾讯中图片滚动怎么制作

腾讯中图片滚动如何制作
http://news.qq.com/photo.shtml
腾讯中图片滚动如何制作？
------解决方案--------------------
通过缩略图掠过事件改变  主图 显示相对就的图,动画用JQ实现
页面排版CSS直接考他的

------解决方案--------------------
代码就写在页面上。

(function () {


    /*-------------------------编辑数据修改-------------------------------*/


    var data = [

        {img1: 'http://img1.gtimg.com/news/pics/hv1/93/163/1426/92767308.jpg', title: '夏俊峰之子哭泣怀念父亲', slink: 'http://news.qq.com/a/20130926/004177.htm#p=1'},

        {img1: 'http://img1.gtimg.com/news/pics/hv1/190/161/1426/92766895.jpg', title: '活着：谁为我负责', slink: 'http://news.qq.com/zt2012/living/yimiao.htm'},

        {img1: 'http://img1.gtimg.com/news/pics/hv1/189/161/1426/92766894.jpg', title: '大黄鸭吻别园博湖 移居颐和园', slink: 'http://news.qq.com/a/20130926/003865.htm#p=1'},

        {img1: 'http://img1.gtimg.com/news/pics/hv1/191/161/1426/92766896.jpg', title: '【影像记忆】辽沈晚报精选：母婴盗窃团', slink: 'http://news.qq.com/zt2012/Memory2012/liaoshenwanbao.htm'},

        {img1: 'http://img1.gtimg.com/news/pics/hv1/88/176/1426/92770618.jpg', title: '世界小姐时装秀 群芳争艳超养眼', slink: 'http://news.qq.com/a/20130926/003596.htm'},

        {img1: 'http://img1.gtimg.com/news/pics/hv1/36/66/1426/92742516.jpg', title: '独家：夏俊峰被执行死刑之后', slink: 'http://news.qq.com/a/20130925/014734.htm#p=1'},

        {img1: 'http://img1.gtimg.com/news/pics/hv1/213/196/1424/92645793.jpg', title: '影像记录曼哈顿街头的女神梦露', slink: 'http://news.qq.com/a/20130923/012719.htm#p=1'},

        {img1: 'http://img1.gtimg.com/news/pics/hv1/55/68/1426/92743045.jpg', title: '夏健强绘画作品饱含对父亲夏俊峰思念之情', slink: 'http://news.qq.com/a/20130925/012023.htm#p=1'},

        {img1: 'http://img1.gtimg.com/news/pics/hv1/133/194/1425/92710228.jpg', title: '巴基斯坦7.7级强震 海上冒出小岛', slink: 'http://news.qq.com/a/20130925/005598.htm#p=1'},

        {img1: 'http://img1.gtimg.com/news/pics/hv1/122/202/1425/92712257.jpg', title: '海南三亚“摩的”当校车 一车拉5人', slink: 'http://news.qq.com/a/20130925/004403.htm#p=1'}

    ]


    /*-------------------------编辑数据修改-------------------------------*/


    var aImg = $('focus_view').getElementsByTagName('li');

    var aTxt = $('focus_text').getElementsByTagName('li');

    var aSmg = $('focus_slider').getElementsByTagName('li');

    var aaImg = $('focus_view').getElementsByTagName('img');

    var aaSmg = $('focus_slider').getElementsByTagName('img');

    var aa0 = $('focus_text').getElementsByTagName('a');

    var aa1 = $('focus_slider').getElementsByTagName('a');

    var aa2 = $('focus_view').getElementsByTagName('a');

    var oUl = $('focus_slider').getElementsByTagName('ul')[0];

    var oNum = $('num');

    var oPrev = $('prev');

    var oNext = $('next');

    for (var i = 0; i < aSmg.length; i++) {

        aSmg[i].index = i;  //当前添加索引

        aImg[i].index = i;

        aa0[i].href = aa1[i].href = aa2[i].href = data[i].slink;

        aa0[i].innerHTML = data[i].title;

        aaImg[i].src = aaSmg[i].src = data[i].img1;



        aSmg[i].onmouseover = function () {

            for (var i = 0; i < aSmg.length; i++) {

                aSmg[i].className = '';

                aTxt[i].className = '';

                startMove(aImg[i], 'opacity', 0);

                aImg[i].style.zIndex = 1;

            }