滑块有问题

时间:2012-11-29 05:52:27

标签: jquery text slider

我无法弄清楚如何编写该代码。

我想要的是它们是两个文本,我们可以点击文本,第一个叫做“test”,第二个叫做“test2”

有一个方框,框内有“配置文件”,当点击“测试”文本时,该框将从左侧移动到中心,并将文本从配置文件更改为框内的“新世界”。 / p>

另一个如果点击test2,该框将移至右侧并将文本更改为“我”

来自预览文字,但问题是当点击test2时,(向右移动)将滑过幻灯片中心并将文本更改为“新世界”,然后转到右侧并将文本更改为“我”。

我不想在转到右边之前不想显示或改变文字。或者如果我是右侧并且想要左侧不是中心,我不想在向中心滑动并显示“新世界”时显示文本更改,我想通过它。

请参阅演示http://jsfiddle.net/Alidad/7eFXS/

我该如何解决这个问题。

请查看代码

 //css
   #apDiv12 {
    position: absolute;
    left: 4px;
    top: -35px;
    width: 271px;
    height: 45px;
    z-index: 102;
    background-image: url(images/tab-box.fw.png);
    background-repeat: no-repeat;
}


//this is where to click on the text"
   <p>test</p>
   <p id='me'>test2</p>






//php code..
<div id="apDiv12">
<h1 id="toptitle">Profil</h1>
<h1 id="toptitled">Profil2</h1>


​</div>



// jquery section


    $(document).ready(function(){
        $('#picTwo').hide();

    $("p").click(function() {
        $('#apDiv12').animate({left: "200px"}, 3000, function () {
     $('#toptitle:contains("Profil")').text("New word"), 3000;

     $('#picOne').fadeOut(500, function(){
         $('#picTwo').fadeIn('fast');


     }); 
        });
           });
    });

    $(function(){

    $("#me").click(function() {
        $('#toptitle').hide();
        $('#apDiv12').animate({left: "400px"}, 3000, function () {
     $('#toptitled:contains("Profil2")').text("me"), 3000;

     $('#picTwo').fadeOut(500, function(){
         $('#picOne').fadeIn('fast');
     }); 
        });
           });
    });

0 个答案:

没有答案