Hello everyone, I wrote responsive design in HTML 5 & CSS 3 and wanted to make responsive logo too, when browser will be resized logo text size will be automatically changed and wrote this code in js, I’m interested about my code this is true way for fixing this problem? or are other ways for fixing this?
My Code: function doResponsive() {
var window_width = $(window).width();
var slider_text = $("#slider > text");
slider_text.css({
'font-size' : parseInt(window_width / 10)-30+'px',
'padding' : parseInt(window_width / 10)-50+'px' + ' 20px'
});
if (parseInt(slider_text.css('font-size')) < 35) {
slider_text.css('display', 'none');
} else {
slider_text.css('display', 'block');
if (parseInt(slider_text.css('font-size')) > 100)
slider_text.css('font-size', '100px');
if (parseInt(slider_text.css('padding')) > 80)
slider_text.css('padding','80px 20px');
}
}
doResponsive();
$(window).resize(doResponsive);
