读书人

高分求“滑块效果”代码要JS的代码

发布时间: 2012-03-12 12:45:32 作者: rapoo

高分求,“滑块效果”代码要JS的代码 100分 答谢大侠了。
我帮同学(希望成为我的GF,嘻嘻)作个Blog,她非要用“滑块”作图片展示的效果。还指名要MSN的那个

http://cnweb.search.live.com/images/results.aspx?q=&FORM=QBIR
(就是右上角的滑块效果)

我晕啊,本来JS就学的,二百五,上网查了也没有任何资料。请高人出手救我一下。
我试试过,抄MSN那个,可是总是出错,(要不怎么说是二百五呢,抄都抄不下来。)

请把代码直接贴到这个帖子上,我试后立即给分。本来想发到javascritp区的,可是那个区没几个活人,还是来这个区了(我认为活人都在.net区)

[解决办法]
用CSS吧,简单,代码不复杂,日后也能用 -- (复用的用) ^_^
[解决办法]
刚看完那个效果,我以前是用表格作的,它的比较复杂,但效果也比较好,设计师下了一番功夫的。

你要是研究的话,我帮一下。
你先清空临时文件夹,再登陆那个页
http://cnweb.search.live.com/images/results.aspx
再上临时文件夹中找到以下文件[并按照我说的存放]
{对了先建controlpic文件夹,js文件夹,css文件夹}
liveimages.js,hf_zh-CN.js,l_sb_c.js =》这几个放到js文件夹中
liveimages.css,l_sb_c.css =》这几个放到css文件中
把以下图片放到controlpic中
action_bar.gif
bullet.gif
cc.gif
combined_assets.png
combobox_button.gif
Favorites.gif
2glyph_close_rest.gif
glyph_collapse_rest.gif
glyph_expand_rest.gif
ico_notify.gif
ico_qna_32x32.png
kill.gif
loading.gif
lod_first.gif
lod_second.gif
myzoo_ninemsn.gif
OneCare.gif
refine_bkgrnd.gif
show_full.gif
slider_button_rest.gif
slider_rail.gif
{可能图片有些是没用的,你自己照量着来}

然后在这些文件夹的同级目录中建一个index.html文件,代码如下

[解决办法]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN " "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd ">

<HTML lang=zh xml:lang= "zh " xmlns= "http://www.w3.org/1999/xhtml " XMLNS:Web =
"http://schemas.live.com/Web/ "> <HEAD> <TITLE> Live Search 图片: </TITLE>
<META http-equiv=content-type content= "text/html; charset=utf-8 "> <!-- TN: 7D6521C3D212276CFA8F5A8EA7AC3AD7 --> <LINK
href= "/s/wlflag.ico " rel=icon>
<STYLE type=text/css> @import url( css/l_sb_c.css );
</STYLE>

<SCRIPT type=text/javascript> // <![CDATA[
var Globals=new function(){this.Mkt= "zh-CN ";this.RTL=false;this.Ver= "3_7_0_138868 ";this.bUsePerfGTracking=false;this.bShowQBCountryTab=false;};var curUrl= "http:\/\/cnweb.search.live.com\/images\/results.aspx ";
//]]> </SCRIPT>

<SCRIPT src= "js/l_sb_c.js " type=text/javascript> </SCRIPT>
<!--[if lt IE 8]>
<STYLE type=text/css> .clear {
HEIGHT: 1%
}
</STYLE>
<![endif]-->
<META content= "MSHTML 6.00.2900.3157 " name=GENERATOR> </HEAD>
<BODY class= "img zhs zh-CN "> <IFRAME id=historyFrame
style= "VISIBILITY: hidden; POSITION: absolute " src= "about:blank "> </IFRAME> <!-- IMPRESSION: ba5749969c7b45c285bec3dfc1d99b5b -->
<DIV id=header_container>
<DIV id=header>
<DIV class=inside>
<DIV class=BrandSection>
<TABLE cellSpacing=0 cellPadding=0>
<TBODY>
<TR>
<TD vAlign=top> <A id=jewel title=更多服务> </A> </TD>
<TD vAlign=top>
<DIV class=Product> Live Search (Beta 版) </DIV>
<DIV> </DIV> </TD> </TR> </TBODY> </TABLE>
<DIV class=Menu id=mainmenu style= "DISPLAY: none "> </DIV> </DIV>
<DIV class= "MeSection simple signedout ">
<DIV class=sme> <A class=ppl


href= "http://login.live.com/login.srf?wa=wsignin1.0&rpsnv=10&ct=1190177562&rver=4.5.2125.0&wp=MBI&wreply=http:%2F%2Fcnweb.search.live.com%2FPassport.aspx%3Frequrl%3Dhttp%253a%252f%252fcnweb.search.live.com%253a80%252fimages%252fresults.aspx&lc=2052&id=76974 "> 登录 <SPAN> </SPAN> </A> </DIV> </DIV>
<DIV class=SearchSection>
<FORM class=efpSf id=searchform name=searchform action=/images/results.aspx>
<TABLE class=efpSc cellSpacing=0 cellPadding=0>
<TBODY>
<TR>
<TD>
<DIV class=efpHl> <SPAN> <INPUT class=q id=q tabIndex=1 name=q> <INPUT class=go id=go tabIndex=1 type=submit align=middle name=go> </SPAN> </DIV> </TD>
<TD id=efpInputs> <INPUT type=hidden value=QBIR
name=form> </TD> </TR> </TBODY> </TABLE> </FORM>
<DIV class=not> </DIV> </DIV>
<DIV style= "CLEAR: both "> </DIV> </DIV> </DIV> </DIV>
<DIV> </DIV>
<DIV id=sch_scopes>
<UL class=sch_scope_bar id=sch_default_bar>
<LI id=sch_scope_web> <SPAN class= "sch_Scope sch_firstChild "> <A
href= "http://cnweb.search.live.com/results.aspx?q=&FORM=BWIR "> 网页 </A> </SPAN>
<LI class=sch_active id=sch_scope_images> <SPAN
class= "sch_Scope sch_lastChild "> <A
href= "http://cnweb.search.live.com/images/results.aspx?q=&FORM=BIIR "> 图片 </A> </SPAN>
<LI id=sch_moreCont> <SPAN class=sch_more> <A id=sch_more
href= "http://cnweb.search.live.com/images/results.aspx# "> 更多 <B> </B> </A> </SPAN> </LI> </UL>
<UL class=sch_scope_bar id=sch_user_bar> </UL> </DIV>
<DIV id=sch_scopeChartDiv>
<DIV id=sch_scopeChart style= "DISPLAY: none ">
<H1> 搜索什么内容? </H1>
<DIV id=sch_scopeLists>
<DIV class=sch_scopeSet>
<UL>
<LI id=sch_scope_feeds> <SPAN class= "sch_Scope sch_lastChild betaScope "> <A
href= "http://cnweb.search.live.com/feeds/results.aspx?q=&FORM=BFIR "> 订阅源 </A> <SPAN
class=beta> Beta </SPAN> </SPAN> </LI> </UL> </DIV>
<DIV class=sch_scopeSet>
<UL>
<LI id=sch_scope_expo> <SPAN class= "sch_Scope sch_lastChild betaScope "> <A
href= "http://expo.live.com/ListingSearch.aspx?keywords=&mkt=zh-CN&FORM=BXIR "> 分类信息 </A> <SPAN
class=beta> Beta </SPAN> </SPAN> </LI> </UL> </DIV>
<DIV class=sch_scopeSet>
<UL>
<LI> <A
href= "http://cnweb.search.live.com/macros/default.aspx?FORM=BJIR "> 编辑宏 </A>
<LI> <A href= "http://gallery.live.com/macros/ "> 查找宏 </A> </LI> </UL> </DIV>
<P class=sch_clearer> </P> </DIV> </DIV> </DIV>
<SCRIPT type=text/javascript> var MMFEXParams={};MMFEXParams.market= "zh-CN ";MMFEXParams.lang= "zh-CN ";MMFEXParams.IG= "ddb141955b484e989f906d7d47c06289 ";MMFEXParams.doeventing=false;MMFEXParams.polltime=5000;MMFEXParams.minqueuesize=10;MMFEXParams.maxqueuesize=50;MMFEXParams.eventingurl= "about:blank ";MMFEXParams.form= " ";MMFEXParams.cid= "AAE666E1EDB04A33BB4FB92090D6412D ";MMFEXParams.location= " ";MMFEXParams.latlong= "0.0/0.0 ";MMFEXParams.drange= "24902.0 ";MMFEXParams.flight= "0 ";MMFEXParams.rf= " ";MMFEXParams.CMS= "IMG:30 ";MMFEXParams.isLiveMarket=true;MMFEXParams.enableScratchpad=false;MMFEXParams.batchSize=30; </SCRIPT>


<LINK href= "css/liveimages.css?v=2_3_2_8062&rev=1 " type=text/css rel=stylesheet>
<DIV id=context_bar_div>
<DIV class=context_results id=context> </DIV>
<DIV id=context_controls>
<DIV class=sizer_slider_results id=sizer_slider>
<DIV id=sizer_rail> <A id=sizer_handle_div title= "zoom level 4 "
style= "LEFT: 40px "> <IMG id=sizer_handle_img
src= "http://cnweb.search.live.com/images/img/slider_button_rest.gif "> </A> </DIV> <A id=sizer_first_button
title= "zoom out " href= "# "> <IMG
id=sizer_first_button_img src= "controlpic/lod_first.gif "> </A> <A
id=sizer_second_button title= "zoom in "
href= "# "> <IMG
id=sizer_second_button_img src= "controlpic/lod_second.gif "> </A> </DIV>
<DIV class=combo_box id=imagesize style= "WIDTH: 116px "> <A class=combo_box_text
id=combo_box_text
href= "# ">   </A> <IMG
class=combo_box_button id=combo_box_button
src= "controlpic/combobox_button.gif "> </DIV> <A id=options
href= "http://cnweb.search.live.com/settings.aspx?ru=%2fimages%2fresults.aspx%3fsetflight%3d0&FORM=SEIR "> Options </A> </DIV> </DIV>
<DIV id=imageSearch>
<DIV class=side_panel_container_results id=side_panel_container
style= "WIDTH: 0em "> </DIV>
<DIV class=message_div_results id=message_div> </DIV>
<DIV class=results_control_results id=results_control>
<DIV id=scroll_panel> </DIV> </DIV>
<DIV class=result_view_panel_results id=result_view_panel> </DIV>
<DIV id=adult_mark_element> </DIV>
<DIV id=staging
style= "VISIBILITY: hidden; OVERFLOW: hidden; WIDTH: 0px; POSITION: absolute; HEIGHT: 0px "
total= "0 "> </DIV>
<SCRIPT src= "js/liveimages.js?language=zh-CN&v=2_3_2_8062&rev=1 " type=text/javascript> </SCRIPT>
</DIV>
<SCRIPT src= "js/hf_zh-CN.js " type=text/javascript> </SCRIPT>

<SCRIPT type=text/javascript> // <![CDATA[
if(null==window[ "Live "])window[ "Live "]=new Object();if(Live.Themes==null)Live.Themes=new Object();Live.Themes.CurrentTheme= "BaseLite ";Live.Themes.CurrentThemeVersion= "11.6.2119 ";Live.Themes.ProductVersion= "11.6.2119 ";Live.Themes.ThemeUrl= "http:\/\/shared.live.com\/~live.themes\/~11.6.2119\/~\/~live.search\/~\/~zh-CN\/~11.6.2119.30117\/BaseLite\/11.6.2119.30117/ ";Live.Header.Settings=new Object();Live.Header.Settings.BaseUrl= 'http://shared.live.com/~Live.GadgetFramework/~11.6.2119/ ';Live.Header.Settings.TemplateUrl= 'http://shared.live.com/~Live.Controls.HeaderTemplate/~/~zh-CN/~live.search/~/~p=Search/~s=1/ ';Live.Header.Utilities.init();
//]]> </SCRIPT>

<DIV> </DIV>
<DIV class=footer_container>
<SCRIPT type=text/javascript> // <![CDATA[
if(null==window[ "Live "]) window[ "Live "]=new Object();Live.Footer=new Object();Live.Footer.Custom= ' <li class= "sep ">  |  </li> <li> <a href= "http://help.live.com/help.aspx?project=wl_webmasters&mkt=zh-cn "> 站点所有者帮助 </a> </li> ';Live.Header.rf();//]]> </SCRIPT>
<NOSCRIPT>
<DIV id=copyright> © 2007 Microsoft. </DIV> </NOSCRIPT> </DIV>
<SCRIPT type=text/javascript> <!--
Globals.LH=function(){LaunchHelp( "http://help.live.com ", "wl_searchv1 ", "zh-CN ", " ", "keyword ", "aidemitlum ",false, " ", " ", " ", " "); return false;};var oFHL=document.getElementById?document.getElementById( "Help "):null;if(oFHL){oFHL.href= "# ";oFHL.onclick=Globals.LH}


--> </SCRIPT>
<img src= "controlpic/slider_button_rest.gif " width= "10 " height= "17 ">
</BODY> </HTML>

[解决办法]
这就差不多,自己再研究一下吧。我原来就表格作的也不错的,只是美工没有它的好,现在在公司,没有办法写上来,等下回吧,上我的CSDN的Blog,我一定贴上,挺有意思的,可能作挺多的应用呢,我是用来作了个小游戏{作了一多半就放在哪个,!^_^}.如果谁还有有意思的应用,给我发个信息,我一定帮忙的,嘻嘻

读书人网 >asp.net

热点推荐