jquery – 在div上切换回到页面顶部

我发现这是其他人的问题,但我发现的所有解决方案都与锚标签有关,这不是问题所在.

我尝试根据解决方案here更改我的代码并添加return false;和event.preventDefault();但这些都没有奏效.我究竟做错了什么？

jQuery的：

$(document).ready(function(){
        $('h1').animate({"right":"147px"},3000);
        $('.more').toggle(
                function(){
                    $(this).css({
                        'z-index':'100','BACkground-position': '41px 0px'
                        });
                    $('#heroFullColor').hide();
                    $('#heroNoColor').show();
                    $('div.' + $(this).attr('id')).fadeIn('fast');
                    $('.more').not(this).hide();
                },function(){
                    $(this).css({
                        'BACkground-position': '0px 0px'
                            });
                    $('div.' + $(this).attr('id')).fadeOut('fast');                 
                    $('#heroNoColor,.infoWindow').hide();
                    $('#heroFullColor').fadeIn('fast');                 
                    $('.more').not(this).show();
                });
    });

HTML结构(在页面上重复多次)：

<div class="more" id="franceFlag"></div>
    <div class="infoWindow franceFlag">
        <img class="imageOn" src="images/lp_foundry_on-franceFlag.jpg" width="71" height="213" alt="French Flag" id="franceFlagOn" />
        <p class="franceFlag">blah blah blah</p>
    </div>      
    <div class="more" id="HeliBoth"></div>
    <div class="infoWindow HeliBoth">
        <img class="imageOn" src="images/lp_foundry_on-HeliBoth.jpg" width="296" height="750" alt="Helicopters" id="HeliBothOn" />
        <p class="HeliBoth">blah blah blah</p>
    </div>

Here is a fiddle – 如果你滚动到右下角,然后点击旗帜旁边的标志,你就会明白我的意思.