如果margin-left = 0px,如何修改margin-left-increase函数以禁用?

时间:2015-09-02 03:34:20

标签: javascript jquery html css

这是我到目前为止的代码。代码实际上工作正常,所以希望这是一个可以帮助我的微小调整吗?

所以我在UL上的宽度是2000px,隐藏了溢出。用户可以滚动缩略图列表进行选择,以显示在上面的div中。

尽管如此,我仍希望看到它是为了好奇心而做的

HTML:

function checkYoutubeRecord(youtubeRecords){
var totalCount = youtubeRecords.length;
var count = 0;
(function downloadLoop(record){
    if(record.Size > 0){
            if(count === totalCount-1){
                console.log('\n\n\ncomplete downloading\n\n\n');
            }else{
                count = count + 1;
                downloadLoop(youtubeRecords[count]);
            }
    }else{
        /*If the size of the record is zero then if don't need to check if it exist
        in the log or not as we have to upload it because of zero size*/
        downloadYoutubeVideo(record,function(done){
            if(done){
                var removeMp2 = record.Key.split('.');
                var removePath = removeMp2[0].split('/');
                **// If use Q.ninvoke throw error Object has no method apply**
                Q.all([
                uploadS3.uploadToS3( __dirname + '/tmp/' + removePath[1] + ".mp4",'/videoTestmp4')])
                .spread(function(uploads){
                    console.log('\n\n\n********************************************');
                    console.log('uploaded successfully==========>>>>>>',record);
                    console.log('********************************************\n\n\n');
                    fs.unlink( __dirname + '/tmp/' + removePath[1] + ".mp4", function(err) {
                        if( err ){
                            console.log(err);
                            console.log('error in unlinking of'+ removePath[1] + '.mp4 file');
                        }else{
                            console.log('successfully removed from tmp folder'+ removePath[1] + '.mp4 file');
                        }
                    });
                    loggerSuccess.info(youtubeRecords[count]);
                    if(count === totalCount-1){
                        console.log('\n\n\ncomplete downloading\n\n\n');
                    }else{
                        count = count + 1;
                        downloadLoop(youtubeRecords[count]);
                    }
                })
                .fail(function(err){
                    console.log('\n\n\n!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!');
                    console.error('fail in uploading the ogv and mp3',record);
                    console.log('!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!\n\n\n');
                    if(failureCount <= 3){
                        failureCount = failureCount + 1;
                        downloadLoop(youtubeRecords[count]);
                    }else{
                        failureCount = 0;
                        loggerfailure.info(youtubeRecords[count]);
                        count = count + 1;
                        downloadLoop(youtubeRecords[count]);
                    }
                })
            }else{
                console.log('\n\n\n!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!');
                console.error('fail in uploading the ogv and mp3',record);
                console.log('!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!\n\n\n');
                if(failureCount <= 3){
                    failureCount = failureCount + 1;
                    downloadLoop(youtubeRecords[count]);
                }else{
                    failureCount = 0;
                    loggerfailure.info(youtubeRecords[count]);
                    count = count + 1;
                    downloadLoop(youtubeRecords[count]);
                }
            }
        });
    }
})(youtubeRecords[0]);
}

CSS

var path = require('path') ;
var AWS = require('aws-sdk') ;
var fs = require('fs') ;
var Q = require('q');

module.exports =  {
  uploadToS3: function(file, s3folder){
    var deferred = Q.defer();
    AWS.config.update({
        accessKeyId: "********************",
        secretAccessKey: "*******************"
    });

    var filename = path.basename( file ) ;
    var key = s3folder + "/" + filename ;

    var s3 = new AWS.S3();

    s3.listObjects({
        Bucket: '****************',
        MaxKeys: 10,
        Prefix: key
    }, function(err, data) {

            console.log('\n\n\n********************************************');
            console.log('source =====>>>>',file);
            console.log('S3 destination ',key);
            console.log('********************************************\n\n\n');

            fs.readFile(file, function(err, data) {
                s3.putObject({
                    Bucket: '****************',
                    Key: key,
                    Body: data,
                    ACL: 'public-read'
                }, function(err, response) {
                    if(err){
                        console.log('\n\n\n!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!');
                        console.log('errror =>>>>',err);
                        console.log('file fail to upload ',file);
                        console.log('!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!\n\n\n');
                        deferred.reject(err);
                    }
                    console.log('\n\n\n********************************************');
                    console.log('response =>>>>',response);
                    console.log('s3 destination ',key);
                    console.log('successfully uploaded to s3');
                    console.log('********************************************\n\n\n');
                    deferred.resolve('uploaded');

                });
            });
    });
return deferred.promise;
}
};

使用Javascript / Jquery的

<img class="thumbSliderLeft" src="Images/left.png" />
<div class="thumbContainer">


<ul class="galleryThumbs">
<li class="gallery"><img class="thumb" src="Images/thumbs/sam.jpg" /></li>

<li class="gallery"><img class="thumb" src="Images/thumbs/cat.jpg" /></li>

<li class="gallery"><img class="thumb" src="Images/thumbs/horse.jpg" /></li>

<li class="gallery"><img class="thumb" src="Images/thumbs/mags.jpg" /></li>

<li class="gallery"><img class="thumb" src="Images/thumbs/tree.jpg" /></li>

<li class="gallery"><img class="thumb" src="Images/thumbs/soup.jpg" /></li>

</ul>



</div>

3 个答案:

答案 0 :(得分:1)

如果正确解释问题,请尝试使用.off(event);请注意.animate()会将margin-left设置为以String结尾的"px",而不是Number 0

不清楚问题0预期在marginLeft === 0代表什么?

$(function () {

        var marginLeft = $("ul.galleryThumbs").css("margin-left");

        $("img.thumbSliderLeft").on("click", function () {
            $("ul.galleryThumbs").animate({
                "margin-left": "+=250px"
            }, 500, 'linear');

            if (marginLeft === 0) { 
                $(this).off("click")
            };

        });
    });

答案 1 :(得分:0)

它没有拿起=== 0的原因是你要将字符串与int进行比较。

除此之外,当你使用jquery获得css时,你会在值之后得到px。您可以通过添加以下内容来解决此问题:

if (parseInt(marginLeft.replace('px','')) === 0){
 //code here
}

答案 2 :(得分:0)

将margin-left的检查移动到处理程序的顶部,并检查css()返回的字符串开头的0:

    if ($("ul.galleryThumbs").css("margin-left")[0] === '0') {
        indentLeft.off()
    }
    $("ul.galleryThumbs").animate({
        "margin-left": "+=250px"
    }, 500, 'linear');