reputation bar with a different picture for each level
3 posters
Page 1 of 1
reputation bar with a different picture for each level
Hello!
I was wondering how I could make a reputation bar that has a different picture each time I saw a few tutorials for the green bars but I was wondering how you could make it a picture and then design it in photoshop
I was wondering how I could make a reputation bar that has a different picture each time I saw a few tutorials for the green bars but I was wondering how you could make it a picture and then design it in photoshop
Re: reputation bar with a different picture for each level
Hi
Try this please:
Change <img src="IMG LINK"/> word "IMG LINK" to the image you want.
Regards,
Pizza Boi
Try this please:
- Code:
$(document).ready(function() {
var version = 'punBB';
var settings = {
repName : 'Reputation',
repStyle : 'block',
repImage : 'http://i57.servimg.com/u/f57/18/21/41/30/star12.png'
};
var repLv = {
lv1 : <img src="IMG LINK"/>,
lv2 : <img src="IMG LINK"/>,
lv3 : <img src="IMG LINK"/>,
lv4 : <img src="IMG LINK"/>,
lv5 : <img src="IMG LINK"/>,
lv6 : <img src="IMG LINK"/>,
lv7 : <img src="IMG LINK"/>,
lv8 : <img src="IMG LINK"/>
};
if (settings.repStyle.toLowerCase() == 'block') { var repBlock = '<span id="rLv" class="repuBlock">' }
else if (settings.repStyle.toLowerCase() == 'image') { var repBlock = '<img id="rLv" src="'+settings.repImage+'"/>' }
else { var repBlock = '<span id="rLv" class="repuBlock">' }
var ver = { phpbb2 : version.toLowerCase() == 'phpbb2', phpbb3 : version.toLowerCase() == 'phpbb3', punbb : version.toLowerCase() == 'punbb', invision : version.toLowerCase() == 'invision' };
var reg = new RegExp('.*'+settings.repName+':\\s+(\\d+).*');
if (ver.phpbb3 || ver.punbb || ver.invision) {
if (ver.phpbb3 || ver.invision) { var profSel = '.postprofile'; var addRepu = $(this).find('dt').append('<div id="repu">'); }
else if (ver.punbb) { var profSel = '.user'; var addRepu = $(this).find('.user-ident').prepend('<div id="repu">'); }
$(profSel).each(function() {
var rep = Number($(this).text().replace(reg,'$1'));
addRepu;
if (rep >= repLv.lv1) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv2 }
if (rep >= repLv.lv2) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv3 }
if (rep >= repLv.lv3) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv4 }
if (rep >= repLv.lv4) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv5 }
if (rep >= repLv.lv5) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv6 }
if (rep >= repLv.lv6) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv7 }
if (rep >= repLv.lv7) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv8 }
if (rep >= repLv.lv8) { $(this).find('#repu').append(repBlock); var next = 'MAX' }
$(this).find('#repu').attr('title','Reputation level ' + $(this).find('#rLv').length + '\nNext : (' + next + ')');
});
}
else if (ver.phpbb2) {
$('td .postdetails.poster-profile').each(function() {
var rep = Number($(this).text().replace(reg,'$1'));
$(this).parent().find('.name').next().after('<div id="repu">');
if (rep >= repLv.lv1) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv2 }
if (rep >= repLv.lv2) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv3 }
if (rep >= repLv.lv3) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv4 }
if (rep >= repLv.lv4) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv5 }
if (rep >= repLv.lv5) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv6 }
if (rep >= repLv.lv6) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv7 }
if (rep >= repLv.lv7) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv8 }
if (rep >= repLv.lv8) { $(this).parent().find('#repu').append(repBlock); var next = 'MAX' }
$(this).parent().find('#repu').attr('title','Reputation level ' + $(this).parent().find('#rLv').length + '\nNext : (' + next + ')');
});
}
});
Change <img src="IMG LINK"/> word "IMG LINK" to the image you want.
Regards,
Pizza Boi
Pizza Boi- Hyperactive
- Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!
Re: reputation bar with a different picture for each level
Hello augustboland,
You would need to modify the script to include these different images. Could you provide the following information ?
Thanks.
Pizza Boi,
Those variables you modified determine that amount of rep needed to achieve the next level. If it is not a number it wont work; it'll just cause a syntax error.
You would need to modify the script to include these different images. Could you provide the following information ?
- The version of your forum, or link to forum
- Will these images be separate like a rank, or all together like : https://i.servimg.com/u/f57/18/21/41/30/captu441.png
Thanks.
Pizza Boi,
Those variables you modified determine that amount of rep needed to achieve the next level. If it is not a number it wont work; it'll just cause a syntax error.
Similar topics
» Can i make a trust level where the same place he waning level is?
» #1269 Mismatch between thumbnail upload picture and actual picture in user galleries - 2
» Mismatch between thumbnail upload picture and actual picture in user galleries
» how can I get a picture of illiweb a picture in a topic or response
» Icon picture padding (showing picture)
» #1269 Mismatch between thumbnail upload picture and actual picture in user galleries - 2
» Mismatch between thumbnail upload picture and actual picture in user galleries
» how can I get a picture of illiweb a picture in a topic or response
» Icon picture padding (showing picture)
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum