使用Jquery随机设置图像的宽度

时间:2014-09-07 13:03:56

标签: jquery css random width

我希望将图像的宽度设置为25%到75%之间的随机数,Jquery可以实现吗?到目前为止,我已经尝试了所有我能想到和研究的东西,但无济于事。

那里有人可以提供帮助吗?

我对JQuery不太好,所以帮助会得到很大的赞赏

我正在尝试使用插件Instafeed来随机化来自用特定主题标签标记的用户帐户的图片大小,所以我完全拥有:

我需要.insta-box在每次加载图像时随机生成一个大小......

<style>
.insta-box {float:center;clear:both;margin:0px;padding:0%;max-height:50%;overflow:hidden;border-width:0;display:inline-block;}</style>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
    <script>
    (function ($) {
        var userId = "UID";
        var accessToken = "Token";
        var numDisplay = "9";
        $.ajax({
            type: "GET",
            dataType: "jsonp",
            cache: false,
url: "https://api.instagram.com/v1/users/"+userId+"/media/recent/?    access_token="+accessToken,
            success: function(data) {
                for (var i = 0; i < numDisplay; i++) {                      
        var rand = Math.floor(Math.random()*10)+10+"%";
            $(".insta-box").css('width', rand);
$(".insta").append("<div class='insta-box'><a target='_blank' href='"+data.data[i].link+"'>
    <img class='instagram-image' src='" + data.data[i].images.low_resolution.url+"'width='auto'/><a></div>"); 
            $(".insta").css('width', '100%');
            }    

            }
        });
    })(jQuery);
    </script>

2 个答案:

答案 0 :(得分:0)

在这里,宽度在窗口宽度的25%到75%之间: DEMO

var rand=Math.floor(Math.random()*75)+25;
var width=Math.round(($(window).width()/100)*rand);
$('img').width(width);

<强>更新

只需使用以下

替换此行$(".insta-box").css('width', rand);
 $(".insta-box").eq(i).css('width', rand);

答案 1 :(得分:0)

这会将图像的宽度设置为25-75之间的随机百分比:

width = Math.floor((Math.random() * 50) + 25).toString();
$("#instafeedimage").width(width + '%');

工作演示here