2

有什么方法可以暂停/恢复这个幻灯片吗?

var timer = setInterval(function () {
    $('.fadein :first-child').fadeOut(1000)
        .next('img').fadeIn(1000)
        .end().appendTo('.fadein').end();

    $('.pc').text($("img:visible").prop("alt"));
}, 6500);

这是整个页面,问题是当我更改此功能时,页面加载时背景中的图像会显示。图像大小不同,这很棘手

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head><title></title>
    <script src="jquery.min.js"></script>
    <script>window.jQuery || document.write(unescape('%3Cscript src="http://api.jquery.com/jquery-wp-content/themes/jquery/js/jquery-1.9.1.min.js"%3E%3C/script%3E'))</script>
    <script src="jquery-migrate-1.1.1.min.js"></script>
    <style>
    html {
    height: 100%;
    }
  #content{
    /*background-color:#ffffff;*/
    background-image:url('Shadow.jpg');
    background-repeat:repeat-y;
    width:1054px;
    /*height:100%;*/
    min-height:970px;
    margin-right:auto;
    margin-left:auto;
  }
  #title{
    width:855px;
    height:30px;
    background-color:#afa87a;
    margin-right:auto;
    margin-left:auto;
  }
  #title p{
    font-family:Verdana;
    color:#ffffff;
    padding-top:5px;
    padding-left:10px;
    margin-left:28px;
    font-size:13px;
    }
  #left{
      width:390px;
      float:left;
      padding-left:80px;
      padding-right:45px;
      padding-top:50px;
      margin-left:12px;
  }
  #right{
      width:415px;
      float:right;
      padding-top:57px;
  }
  #left p{
    font-family:Verdana;
    color:#000000;
    padding-top:5px;
    padding-left:10px;
    font-size:12px;
  }
  #footer p
  {
       font-family:Verdana;
    color:#000000;
    padding-top:5px;
    padding-left:10px;
    font-size:12px;

  }
  h1{
     font-family:Verdana;
    font-size:14px;
    margin-left:9px;
  }
  a
  {
      color:White;
      text-decoration:none;
  }
  a:hover
  {
      text-decoration:underline;
  }
  ul
  {
      margin-left:-15px;
  }
  ul li
  {
   margin-top:-5px;   
  }
 li p{margin-left:-7px;}
.fadein { position:relative; height:332px; width:500px; }
.fadein img { position:absolute; left:0; top:0; }
.caption { position:relative; height:332px; width:500px; }
.caption img { position:absolute; left:0; top:0; }
.captext
{
    font-family:Tahoma;
    font-size:14px;
    padding-top:15px;
    padding-right:15px;
    padding-left:15px;
}
#footer
{
    padding-top:30px;
    margin-left:auto;
    margin-right:auto;
    width:1054px;
}
.pc
{
    margin-top:200px;
}
</style>
</head>
<body style="background-color:#f0e8b0;height:100%;width:100%;margin:0;">

<script type="text/javascript">
    $(document).ready(function () {
        $(function () {
            $('.fadein img:gt(0)').hide();
            $('.pc').text($("img:visible").prop("alt"));

        /*    $(".fadein").mouseover(function () {
                //$(this).stop();
                clearInterval(timer);
                return false;
            });*/

           var timer = setInterval(function () {
                $('.fadein :first-child').fadeOut(1000)
                    .next('img').fadeIn(1000)
                    .end().appendTo('.fadein').end();

                $('.pc').text($("img:visible").prop("alt"));
            }, 6500);
        });
    });
</script>
    <div id="content">
        <img src="62e.jpg" style="width:851px;margin-left:100px;" alt=""/>
        <div id="title"><p>Greenville, South Carolina 29605  <strong>·</strong>  Contact Emelia  <strong>·</strong>  864-200-0000  <strong>·</strong>  <a href="mailto:test@test.com">test@test.com</a></div>


    <div id="left">

        <h1>Beautiful Country Club/Traxler Park Home</h1>
        <p>Located in the Greenville Country Club/Traxler Park neighborhood, this lovely home, built in 1946, has been extensively renovated, with high ceilings and hardwood floors throughout. Convenient to downtown, yet offers the ambiance of a creekside mountain retreat.</p>

        <ul>
        <li><p>Two and a half stories including : 4 bedrooms, 3 1/2 baths, living room, dining room, den, office/library, eat-in kitchen , screened porch, playroom, exercise area, laundry, workshop, 2-car garage. 4100 square feet.</p></li>

        <li><p>New 30-year roof, Hardiplank siding, gutters, custom shutters, paint and insulation in May 2011. All windows replaced.</p></li>

        <li><p>Other extras include security system, generator, whole house fan.</p></li>

        <li><p>Beautifully landscaped with sun and shade gardens and stone walls. The creek on 2 sides is spanned by a stone bridge. Highlights include a large magnolia, huge rhododendron, hemlocks and hardwood trees. Irrigation system for lawn and beds.</p></li>

        </ul>
        <br />
        <strong><p><u>Main Floor</u></p></strong>
        <ul>
        <li><p>Gracious entrance foyer with staircase and coat closet.</p></li>

        <li><p>Large Living Room (23 x 15) with vented gas fireplace, double French door leading to screened porch, windows with views of woods and lawn.</p></li>

        <li><p>Large Den (18 x 15 1/2) with vented gas fireplace, custom mantle. Custom wainscoting. Built-in cabinet for TV and stereo, speakers in ceiling. Bookcases, window seat. Walk-in storage closet. Ceiling fan.</p></li>

        <li><p>Open Kitchen (14 x 14) Custom maple island with sink and seating. Corian counters with integrated, oversized double sink. Coffee garage. Double Jenn-Aire ovens, Thermador solid surface cooktop, Miele stainless steel dishwasher. Walk in pantry (8 1/2 x 5) with wine cooler, plumbed for washer and dryer. Breakfast area adjoining (9 1/2 x 9). Sound system.</p></li>

        <li><p>Dining Room (14 x 14) with Brunschwig et Fils wallpaper, door to screened porch and windows overlooking the woods and creek is the perfect place for family dinners and dinner parties.</p></li>

        <li><p>Screened porch (15 x 14) overlooking the woods and creek. Ceiling fan. Brick floor. Enjoyable spot for morning coffee while listening to the birds, as well as evening suppers listening to owls and tree frogs.</p></li>

        <li><p>Office/Library (10 x 9) with built-in bookcases.</p></li>

        <li><p>Powder room. Off of office/library. Schumacher toile wallpaper. Pedestal sink.</p></li>

        </ul>
        <br />
<strong><p><u>Upstairs</u></p></strong>
        <ul>
        <li><p>Generously sized (18 1/2 x 13) master bedroom with 4 windows with plantation shutters, seating area, and 7 1/2 x 4 1/2 entry. Linen closet and 10 1/2 x 5 walk-in cedar closet. Ceiling fan.</p></li>

        <li><p>Master bath (13 x 11) with custom teak cabinetry, heated towel warmer, double lavatories, built-in vanity, soaking tub, separate shower and toilet alcove.  Large (13 x 7 1/2) walk-in closet and dressing area accessed from bathroom. Audio system.</p></li>

        <li><p>Bedroom #2 (14 x 10 1/2) with double closet and views of creek and woods. Ceiling fan.</p></li>

        <li><p>Bedroom #3 (15 x 12) with views of woods and lawn.</p></li>

        <li><p>Bedroom #4 (10 1/2 x 9 1/2) smaller room with lovely views. Ceiling fan. Wired for telephone and fax. Ideal home office or nursery.</p></li>

        <li><p>Hall bath with combination tub-shower, solid surface vanity with integrated sink. Solid surface shower walls.</p></li>

        </ul>
        <br />
<strong><p><u>Lower Level</u></p></strong>
        <ul>
        <li><p>Recreation room (19 1/2 x 13 1/2) with exercise alcove (14 1/2 x 8). Built-in bench storage plus large walk-in storage closet (17 x 9 1/2). Floor to ceiling windows. Full bath with shower.</p></li>

        <li><p>Laundry room (22 x 8) with built-in shelving. Space for extra refrigerator and wine storage.</p></li>

        <li><p>Workshop/mechanical room (23 x 15).</p></li>

        <li><p>Two-car open garage connected to house by breezeway.</p></li>

        </ul>
        <br />
<strong><p><u>Property</u></p></strong>
        <ul>
        <li><p>Secluded lot on .333 acres, with abundant hardwood trees, adjacent to the Greenville Country Club.</p></li>

        <li><p>Private and peaceful wooded setting with mature evergreens, rock walls and spring-fed creek with stone bridge.</p></li>

        <li><p>Meticulously landscaped.  Shade gardens include specimen Lenten roses, numerous varieties of fern, hostas, trillium, and rhododendron. Grounds also have mature boxwood, hydrangeas, gardenia, climbing hydrangea and a large magnolia. There are a herb garden and a daylily garden. The cutting garden with salvias, phlox, Mexican sage, lavender, daisies and veronica can be viewed from the kitchen window.</p></li>

        <li><p>Automated irrigation system with separate ground water meter.</p></li>

        <li><p>Custom grounds lighting</p></li>

        </ul>
        <br />
<strong><p><u>Schools</u></p></strong>
        <ul>
        <li><p>Elementary - Blythe Academy of Languages</p></li>

        <li><p>Hughes Middle School</p></li>

        <li><p>Greenville Senior High School</p></li>

        <li><p>Convenient to Christ Church Episcopal School, St. Joseph's and numerous pre-schools.</p></li>

        </ul>           
    </div>
    <div id="right">

    <div id="slideshow" class="fadein"> <img src="imgs/1.jpg" alt="Mailbox and Driveway and Front View" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/2.jpg" alt="Exterior Front" style="border:3px solid #afa87a;margin-left:-120px;"/> 
      <img src="imgs/3.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/4.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/5.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/6.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/7.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/8.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/9.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/10.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/11.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/12.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/13.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/14.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/15.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/16.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/17.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/18.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/19.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/20.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/21.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/22.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/23.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/24.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/25.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/26.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/27.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/28.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/29.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/30.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/31.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/32.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
      <img src="imgs/33.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/34.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/35.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/36.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/37.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/38.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/39.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/40.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/41.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/42.jpg" alt="" style="border:3px solid #afa87a;margin-left:-125px;"/> 
      <img src="imgs/43.jpg" alt="" style="border:3px solid #afa87a;margin-left:-66px;"/> 
    </div>
     <!-- <div class="caption">

      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Mailbox and Driveway and Front View</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Exterior Front</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Exterior Front</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Property, yard and landscaping</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Property, yard and landscaping</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Property, yard and landscaping</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Property, yard and landscaping</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Property, yard and landscaping</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Property, yard and landscaping</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Back Exterior View</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Screened porch (15x14) overlooking the woods and creek. Ceiling fan. Brick floor. Enjoyable spot for morning coffee while listening to the birds, as well as evening suppers listening to owls and tree frogs.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Screened porch (15x14) overlooking the woods and creek. Ceiling fan. Brick floor. Enjoyable spot for morning coffee while listening to the birds, as well as evening suppers listening to owls and tree frogs.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Screened porch (15x14) overlooking the woods and creek. Ceiling fan. Brick floor. Enjoyable spot for morning coffee while listening to the birds, as well as evening suppers listening to owls and tree frogs.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Screened porch (15x14) overlooking the woods and creek. Ceiling fan. Brick floor. Enjoyable spot for morning coffee while listening to the birds, as well as evening suppers listening to owls and tree frogs.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Two-car open garage connected to house by breezeway.</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Side View of the exterior.</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Open Kitchen (14 x 14) Custom maple island with sink and seating. Corian counters with integrated, oversized double sink. Coffee garage. Double Jenn-Aire ovens, Thermador solid surface cooktop, Miele stainless steel dishwasher. Walk in pantry (8 ½ x 5) with wine cooler, plumbed for washer and dryer. Breakfast area adjoining (9 ½ x 9). Sound system.</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Open Kitchen (14 x 14) Custom maple island with sink and seating. Corian counters with integrated, oversized double sink. Coffee garage. Double Jenn-Aire ovens, Thermador solid surface cooktop, Miele stainless steel dishwasher. Walk in pantry (8 ½ x 5) with wine cooler, plumbed for washer and dryer. Breakfast area adjoining (9 ½ x 9). Sound system.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Open Kitchen (14 x 14) Custom maple island with sink and seating. Corian counters with integrated, oversized double sink. Coffee garage. Double Jenn-Aire ovens, Thermador solid surface cooktop, Miele stainless steel dishwasher. Walk in pantry (8 ½ x 5) with wine cooler, plumbed for washer and dryer. Breakfast area adjoining (9 ½ x 9). Sound system.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Open Kitchen (14 x 14) Custom maple island with sink and seating. Corian counters with integrated, oversized double sink. Coffee garage. Double Jenn-Aire ovens, Thermador solid surface cooktop, Miele stainless steel dishwasher. Walk in pantry (8 ½ x 5) with wine cooler, plumbed for washer and dryer. Breakfast area adjoining (9 ½ x 9). Sound system.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Open Kitchen (14 x 14) Custom maple island with sink and seating. Corian counters with integrated, oversized double sink. Coffee garage. Double Jenn-Aire ovens, Thermador solid surface cooktop, Miele stainless steel dishwasher. Walk in pantry (8 ½ x 5) with wine cooler, plumbed for washer and dryer. Breakfast area adjoining (9 ½ x 9). Sound system.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Open Kitchen (14 x 14) Custom maple island with sink and seating. Corian counters with integrated, oversized double sink. Coffee garage. Double Jenn-Aire ovens, Thermador solid surface cooktop, Miele stainless steel dishwasher. Walk in pantry (8 ½ x 5) with wine cooler, plumbed for washer and dryer. Breakfast area adjoining (9 ½ x 9). Sound system.</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">(Large) Den (18 x 15 1/2) with vented gas fireplace, custom mantle. Custom wainscoting. Built-in cabinet for TV and stereo, speakers in ceiling. Bookcases, window seat. Walk-in storage closet. Ceiling fan.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">(Large) Den (18 x 15 1/2) with vented gas fireplace, custom mantle. Custom wainscoting. Built-in cabinet for TV and stereo, speakers in ceiling. Bookcases, window seat. Walk-in storage closet. Ceiling fan.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">(Large) Den (18 x 15 1/2) with vented gas fireplace, custom mantle. Custom wainscoting. Built-in cabinet for TV and stereo, speakers in ceiling. Bookcases, window seat. Walk-in storage closet. Ceiling fan.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Dining Room (14 x 14) with Brunschwig et Fils wallpaper, door to screened porch and windows overlooking the woods and creek is the perfect place for family dinners and dinner parties.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Dining Room (14 x 14) with Brunschwig et Fils wallpaper, door to screened porch and windows overlooking the woods and creek is the perfect place for family dinners and dinner parties.</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Gracious entrance foyer with staircase and coat closet.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">(Large)Living Room (23 x 15) with vented gas fireplace, double French door leading to screened porch, windows with views of woods and lawn.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">(Large)Living Room (23 x 15) with vented gas fireplace, double French door leading to screened porch, windows with views of woods and lawn.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Office/Library (10 x 9) with built-in bookcases.</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Powder room. Off of office/library. Schumacher toile wallpaper. Pedestal sink.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Generously sized (18 ½ x 13) master bedroom with 4 windows with plantation shutters, seating area, and 7 ½ x 4 ½ entry. Linen closet and 10 ½ x 5 walk-in cedar closet. Ceiling fan.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Generously sized (18 ½ x 13) master bedroom with 4 windows with plantation shutters, seating area, and 7 ½ x 4 ½ entry. Linen closet and 10 ½ x 5 walk-in cedar closet. Ceiling fan.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Master bath (13 x 11) with custom teak cabinetry, heated towel warmer, double lavatories, built-in vanity, soaking tub, separate shower and toilet alcove.  Large (13 x 7 1/2) walk-in closet and dressing area accessed from bathroom. Audio system.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Master bath (13 x 11) with custom teak cabinetry, heated towel warmer, double lavatories, built-in vanity, soaking tub, separate shower and toilet alcove.  Large (13 x 7 1/2) walk-in closet and dressing area accessed from bathroom. Audio system.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Master bath (13 x 11) with custom teak cabinetry, heated towel warmer, double lavatories, built-in vanity, soaking tub, separate shower and toilet alcove.  Large (13 x 7 1/2) walk-in closet and dressing area accessed from bathroom. Audio system.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Bedroom #2 (14 x 10 1/2) with double closet and views of creek and woods. Ceiling fan.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Bedroom #2 (14 x 10 1/2) with double closet and views of creek and woods. Ceiling fan.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Bedroom #2 (14 x 10 1/2) with double closet and views of creek and woods. Ceiling fan.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Bedroom #3 (15 x 12) with views of woods and lawn.</div>
      <div style="width:470px;height:145px;background-color:white;margin-top:55px;margin-left:-110px;" class="captext">Bedroom #4 (10 ½ x 9 1/2) smaller room with lovely views. Ceiling fan. Wired for telephone and fax.  Ideal  home office or nursery.</div>
      <div style="width:345px;height:145px;background-color:white;margin-top:180px;margin-left:-60px;" class="captext">Hall bath with combination tub-shower, solid surface vanity with integrated sink.  Solid surface shower walls.</div>

      </div>-->

    </div>
    <div style="clear:both;"></div>
    <div id="footer">
    <br />
            <br />
        <br />
    </div>
   </div>
</body>
</html>
4

4 回答 4

2

分离出函数和间隔......类似

var timer = setInterval(runMe, 6500);

function runMe() {
    $('.fadein :first-child').fadeOut(1000)
       .next('img').fadeIn(1000)
       .end().appendTo('.fadein').end();

    $('.pc').text($("img:visible").prop("alt"));
}

function stop() {
    clearInterval(timer);
}

function resume() {
    timer = setInterval(runMe, 6500);
}

clearInterval()这里的文档

注意:完全未经测试 - 但你明白了

根据评论...然后将一些按钮/链接绑定到功能

$('#stopMe').click(stop);
$('#resumeMe').click(resume);
于 2013-05-16T17:19:12.000 回答
1

我认为这种技术可以工作:

更新:工作小提琴:http:
//jsfiddle.net/8Ybfx/2/

jQuery代码

// jquery = global vars to manage the stae
var timer = null;
var current = null;

$(document).ready(function(){
    // set up the pause click event
    $("#pause").hide();
    $("#pause").on("click", function(){
        clearInterval(timer);
        $("#pause").hide();
        $("#play").show();
    });

    // set up the play click event
    $("#play").on("click", function(){

        // keep track of the timer
        timer = setInterval(function () {
                    var el = null;
                    if (current != null){
                        el = current;
                    }else{
                        el = $('.fadein :first-child');
                    }

                    // keep track of the current image being displayed 
                    // (i.e. where you left off)
                    current = $(el).fadeOut(1000).next('p');
                    current.fadeIn(1000).end().appendTo('.fadein').end();

                    $('.pc').text($("img:visible").prop("alt"));

                }, 2000);
        $("#play").hide();
        $("#pause").show();
    }); 
});    

html(用p做测试,把p改成img)

<div id="pause" class="btn">pause</div>
<div id="play" class="btn">play</div>

<div class="fadein">
    <p>image 1</p>
    <p>image 2</p>
    <p>image 3</p>
    <p>image 4</p>    
</div>

CSS:

/* In your live case, change p to img */
.fadein p{
    display: none;
}

.btn{
    cursor: pointer;
    cursor: hand;
}
于 2013-05-16T17:26:41.157 回答
0

有clearInterval

clearInterval(timer)

这会停止/暂停间隔,以再次使用 setInterval

于 2013-05-16T17:19:05.390 回答
0

是的,有几个。您可以使用 停止执行clearInterval(timer)。您可以在其他地方设置一个变量,您可以在函数中检查该变量。setTimeout()而且您每次都可以使用和调用它。

于 2013-05-16T17:20:42.947 回答