响应式照片墙html,jQuery 响应式随机用户照片墙

最新推荐文章于 2024-05-20 20:38:39 发布

知乎知+自选

最新推荐文章于 2024-05-20 20:38:39 发布

阅读量195

点赞数

文章标签：响应式照片墙html

这段JavaScript代码定义了一个jQuery插件randomUserWall，用于生成指定数量的随机女性头像。它根据传入的参数如性别、图片大小等从预定义的数组中选择头像，并确保不重复。该插件适用于前端开发中的头像展示场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JavaScript

语言：

JaveScriptBabelCoffeeScript

确定

(function(b, c) {

b.fn.randomUserWall = function(e) {

e = b.extend({}, b.fn.randomUserWall.options, e);

return this.each(function() {

var f = [],

m = [],

k, j, n, h = "";

for (var g = 0; g < e.numFaces; g++) {

do {

if (e.gender == "female") {

j = true

} else {

if (e.gender == "male") {

j = false

} else {

j = Math.random() < 0.5 ? false : true

}

k = d(j);

n = a(j, k, f, m, n)

} while (n === false)

}

if (e.imgSize == "thumb") {

h = "thumb/"

} else {

if (e.imgSize == "med") {

h = "med/"

}

if (e.gender == "female") {

for (g = 0; g < e.numFaces; g++) {

b(this).append(' '%20+%20h%20+%20 ')

}

} else {

if (e.gender == "male") {

for (g = 0; g < e.numFaces; g++) {

b(this).append(' '%20+%20h%20+%20 ')

}

} else {

var l = false;

do {

j = Math.random() < 0.5 ? false : true;

if ((j === false) && (m.length > 0)) {

b(this).append(' '%20+%20h%20+%20 ');

m.splice(0, 1)

} else {

if ((j === true) && (f.length > 0)) {

b(this).append(' '%20+%20h%20+%20 ');

f.splice(0, 1)

}

if ((f.length === 0) && (m.length === 0)) {

l = true

}

} while (l === false)

}

})

};

function d(e) {

var f, g = 100;

totalNumberOfFemaleFaces = 96;

if (e === false) {

f = Math.floor(Math.random() * g)

} else {

if (e === true) {

f = Math.floor(Math.random() * totalNumberOfFemaleFaces)

} else {

console.error("RandomUserWall ERROR: Thunk.")

}

return f

}

function a(f, i, e, g, h) {

if (f === true) {

if (b.inArray(i, g) >= 0) {

h = false

} else {

h = true;

g.push(i)

}

return h

} else {

if (f === false) {

if (b.inArray(i, e) >= 0) {

h = false

} else {

h = true;

e.push(i)

}

return h

} else {

console.error("RandomUserWall Error: Clunk.")

}

b.fn.randomUserWall.options = {

numFaces: 0,

gender: "",

imgSize: ""

}

})(jQuery);

// this comment is here to stop codepens insane indenting

$('.wall').randomUserWall({

numFaces: 98

});