0

可能重复：
向轮播横幅添加视差效果，使图像和文本以不同的速度移动

我正在尝试实现 ibm 的轮播，你们能告诉我他们为轮播使用了什么 js 文件吗？我尝试使用 firebug 进行调试，但找不到 http://www.ibm.com/us/en/

提供下面的脚本标签

<title>IBM - United States</title>
<script src="//1.www.s81c.com/common/js/ipadpilot.js">//</script>
<link href="//1.www.s81c.com/common/v17/css/www.css" rel="stylesheet" title="www" type="text/css">
<script src="//1.www.s81c.com/common/js/dojo/www.js" type="text/javascript">//</script><link rel="search" type="application/opensearchdescription+xml" href="http://www.ibm.com/search/opensearch/description.xml" title="IBM Search">
<link type="text/css" title="www" rel="stylesheet" href="//1.www.s81c.com/common/v17/css/homepage.css">
<script type="text/javascript">
ibmweb.config.set({ sbs: { enabled: false }, easyaccess: { enabled: false }  });

dojo.require('ibmweb.homepage');

</script><script type="text/javascript" charset="utf-8" src="//1.www.s81c.com/common/js/dojo/1.6/ibmweb/homepage.xd.js"></script>
<style type="text/css">
4

1 回答 1

1

以下都是基于DOJO lib的JS：

<div class="ibm-container" id="ibm-promotion-module">
    <div class="ibm-container-body" dojoattachpoint="ribbonContainer" id="ibmweb_ribbon_1"
    widgetid="ibmweb_ribbon_1">
        <a class="ibm-ribbon-prev" dojoattachpoint="scrollLeftButton" role="button"
        href="#" style="margin-top: 63px;" tabindex="-1" title="Previous">Previous</a>
        <div class="ibm-ribbon-pane" dojoattachpoint="scrollContainer"
        style="height: 130px;">
            <div class="ibm-ribbon-section" dojoattachpoint="scrollableNode" role="listbox"
            id="ibmweb_ribbon_1_scrollable" style="left: -330px;">
                <div class="ibm-columns" dojoattachpoint="containerNode" role="option"
                id="ibmweb_ribbonSlide_3" widgetid="ibmweb_ribbonSlide_3">
                    <div class="ibm-col-6-2 ibm-expand-section" role="document" tabindex="0"
                    id="ibmweb_ribbonItemAbstract_3" widgetid="ibmweb_ribbonItemAbstract_3">
                        <!-- eTree :.: Fragment (Image) :.: B302493F36942F04 [R115708Q56317O19]-->
                        <a href="http://www.ibm.com/smarterplanet/us/en?link=ibmhpcs1/corp/smarterplanet/menu">
                            <img alt="Let's build a smarter planet. Explore by smarter industry or topic."
                            height="98" width="318" src="/images/portal/Z228008Z63930L48/csm1_09192011hp_smarter_planet01.png">
                        </a>
                        <div class="ibm-expand-overlay">
                            <div class="ibm-expand-head">
                                <p>
                                    <!-- eTree :.: Fragment (Text) :.: P184488Y05808D03 [P184488Y05808D03]-->
                                    <a href="http://www.ibm.com/smarterplanet/us/en/?re=CS1">Let's build a smarter planet</a>
                                </p>
                                <div class="ibm-sp-icons"></div>
                            </div>
                            <div class="ibm-expand-body">
                                <div class="ibm-expand-body-1">
                                    <!-- eTree :.: Fragment (List) :.: N946533F31089V16 [N946533F31089V16]-->

                             <h2>Industry</h2>

                                    <ul>
                                        <li>
                                            <a class="ibm-sp-overview" href="http://www.ibm.com/smarterplanet/us/en/overview/ideas/index.html?re=CS1">Overview</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-analytics" href="http://www.ibm.com/analytics/us/en/?re=CS1">Analytics</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-banking" href="http://www.ibm.com/smarterplanet/us/en/banking_technology/ideas/index.html?re=CS1">Banking</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-buildings" href="http://www.ibm.com/smarterplanet/us/en/green_buildings/overview/index.html?re=CS1">Buildings</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-work" href="http://www.ibm.com/smarterplanet/us/en/business_agility/ideas/index.html?re=CS1">Business agility</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-cities" href="http://www.ibm.com/smarterplanet/us/en/smarter_cities/overview/index.html?re=CS1">Cities</a>
                                        </li>
                                    </ul>
                                </div>
                                <div class="ibm-expand-body-2">
                                    <h2>Topic</h2>
                                    <ul class="ibm-first">
                                        <li>
                                            <a class="ibm-sp-cloud" href="http://www.ibm.com/cloud">Cloud</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-commerce" href="http://www.ibm.com/smarterplanet/us/en/smarter_commerce/overview/index.html?re=CS1">Commerce</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-computing" href="http://www.ibm.com/smarter-computing/us/en/?re=CS1">Computing</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-education" href="http://www.ibm.com/smarterplanet/us/en/education_technology/ideas/index.html?re=CS1">Education</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-energy" href="http://www.ibm.com/smarterplanet/us/en/smart_grid/ideas/index.html?re=CS1">Energy</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-government" href="http://www.ibm.com/smarterplanet/us/en/government/ideas/index.html?re=CS1">Government</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-healthcare" href="http://www.ibm.com/smarterplanet/us/en/healthcare_solutions/ideas/index.html?re=CS1">Healthcare</a>
                                        </li>
                                    </ul>
                                    <ul class="ibm-second">
                                        <li>
                                            <a class="ibm-sp-products" href="http://www.ibm.com/smarterplanet/us/en/embedded_systems/overview/index.html?re=CS1">Products and services</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-security" href="http://www.ibm.com/smarterplanet/us/en/business_resilience_management/overview/index.html?re=CS1">Security and resilience</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-sustainability" href="http://www.ibm.com/smarterplanet/us/en/green_and_sustainability/overview/index.html?re=CS1">Sustainability</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-telecom" href="http://www.ibm.com/smarterplanet/us/en/communication_technology/ideas/index.html?re=CS1">Telecom</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-transportation" href="http://www.ibm.com/smarterplanet/us/en/transportation_systems/overview/index.html?re=CS1">Transportation</a>
                                        </li>
                                        <li>
                                            <a class="ibm-sp-water" href="http://www.ibm.com/smarterplanet/us/en/water_management/ideas/index.html?re=CS1">Water</a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <ul class="ibm-sp-tools">
                                <li>
                                    <a title="Facebook" class="ibm-share-facebook" href="http://www.facebook.com/peopleforasmarterplanet?re=CS1"></a>
                                </li>
                                <li>
                                    <a title="Twitter" class="ibm-share-twitter" href="http://www.twitter.com/smarterplanet?re=CS1"></a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="ibm-columns" dojoattachpoint="containerNode" role="option"
                id="ibmweb_ribbonSlide_4" widgetid="ibmweb_ribbonSlide_4">
                    <div class="ibm-col-6-2 " role="document" tabindex="0" id="ibmweb_ribbonItemAbstract_4"
                    widgetid="ibmweb_ribbonItemAbstract_4">
                        <!-- eTree :.: Fragment (Image) :.: J527612Q18333Q57 [Z630132F24149K18]-->
                        <a href="http://www.ibm.com/smarterplanet/us/en/innovation_explanations/article/guru_banavar.html">
                            <img alt="Innovations explanations. Guru Banavar explains why cities need to get smarter"
                            height="98" width="318" src="/images/portal/Z630132F24149K18/12172012_banavar_csm.png"
                            class="ibm-no-mobile">
                            <img alt="Innovations explanations. Guru Banavar explains why cities need to get smarter"
                            height="98" width="318" src="/images/portal/Z630132F24149K18/12172012_banavar_csm.png"
                            class="ibm-mobile">
                        </a>
                    </div>
                </div>
                <div class="ibm-columns" dojoattachpoint="containerNode" role="option"
                id="ibmweb_ribbonSlide_5" widgetid="ibmweb_ribbonSlide_5">
                    <div class="ibm-col-6-2 " role="document" tabindex="0" id="ibmweb_ribbonItemAbstract_5"
                    widgetid="ibmweb_ribbonItemAbstract_5">
                        <!-- eTree :.: Fragment (Image) :.: H911989L14230B33 [T608269X41766H94]-->
                        <a href="http://www.ibm.com/software/collaboration/events/connect/">
                            <img alt="Social business, meet technology. Register now for a discount to IBM Connect 2013"
                            height="98" width="318" src="/images/portal/T608269X41766H94/12172012_connect_csm.png"
                            class="ibm-no-mobile">
                            <img alt="Social business, meet technology. Register now for a discount to IBM Connect 2013"
                            height="98" width="318" src="/images/portal/T608269X41766H94/12172012_connect_csm.png"
                            class="ibm-mobile">
                        </a>
                    </div>
                </div>
                <div class="ibm-columns" dojoattachpoint="containerNode" role="option"
                id="ibmweb_ribbonSlide_6" widgetid="ibmweb_ribbonSlide_6">
                    <div class="ibm-col-6-2 " role="document" tabindex="0" id="ibmweb_ribbonItemAbstract_6"
                    widgetid="ibmweb_ribbonItemAbstract_6">
                        <!-- eTree :.: Fragment (Image) :.: N568931Q76017I54 [Y307681Q28893R02]-->
                        <a href="http://www.ibm.com/account/orderstatus/mobile/">
                            <img alt="IBM order info on the go. Away from your desktop? Use Order Status OnLine Mobile"
                            height="98" width="318" src="/images/portal/Y307681Q28893R02/cms4_order_status_mobile.png">
                        </a>
                    </div>
                </div>
                <div class="ibm-columns" dojoattachpoint="containerNode" role="option"
                id="ibmweb_ribbonSlide_7" widgetid="ibmweb_ribbonSlide_7">
                    <div class="ibm-col-6-2 " role="document" tabindex="0" id="ibmweb_ribbonItemAbstract_7"
                    widgetid="ibmweb_ribbonItemAbstract_7">
                        <!-- eTree :.: Fragment (Image) :.: S428344A26958U85 [X793998X98785J28]-->
                        <a href="http://www.redbooks.ibm.com/">
                            <img alt="Hands on and step-by-step. Download thousands of IBM Readbooks -- Free."
                            height="98" width="318" src="/images/portal/X793998X98785J28/08152011_Redbooks.png">
                        </a>
                    </div>
                </div>
            </div>
        </div>
        <a class="ibm-ribbon-next" dojoattachpoint="scrollRightButton" role="button"
        href="#" style="margin-top: -87px;" tabindex="-1" title="Next">Next</a>
    </div>
</div>
于 2012-12-22T04:30:55.790 回答