من میخوام چندتا پاراگراف بذارم تو صفحم که وقتی دکمه بزرگنمایی رو میزنم هربار با فشرن دکمه سایز متن من بزرگ و بزرگ تر بشه و وقتی کوچک نمایی رو مفشارم سایز متن من هی کوچیک و کوچیک تر بشه؟
3
درود.
تست کنید:
<html>
<head>
</head>
<body>
<button id="plustext" >BIGGER</button>
<button id="minustext" >SMALLER</button>
<p id="test" >HELLO WORLD!</p>
<script>
function init(){
var el = document.getElementById('test');
document.getElementById("plustext").addEventListener("mousedown", function(){
resizeText(el,5);
},false);
document.getElementById("minustext").addEventListener("mousedown", function(){
resizeText(el,-5);
},false);
}
function css( element, property ) {
return window.getComputedStyle( element, null ).getPropertyValue( property );
}
function resizeText(el, size) {
var fontSize = parseFloat(css(el,'font-size'));
el.style.fontSize= fontSize + size + "px";
}
window.addEventListener("load", init);
</script>
</body>
</html>
راستی تو این کد از جاوا اسکریپت خالص استفاده شده یعنی به جی کوئری و امثال اون نیاز نیست.
آخرین ویرایش: 30-06-2015 ???? 11:17، توسط REza mAX
0
خیلی سپاس گذارم .
ولی این برای من خیلی پیچیده است از این ساده ترم میشه نوشت؟(یعنی فقط با رویدادclickو متد css) البته با انواع متغیرم آشنا هستم
2
با جی کوئری:
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#incfont').click(function(){
curSize= parseInt($('#content').css('font-size')) + 2;
if(curSize<=30)
$('#content').css('font-size', curSize);
});
$('#decfont').click(function(){
curSize= parseInt($('#content').css('font-size')) - 2;
if(curSize>=12)
$('#content').css('font-size', curSize);
});
});
</script>
</head>
<body>
<div id="content" style="height:260px">
This is a test
</div>
<a href="#" id="incfont">A+</a>
<a href="#" id="decfont">A-</a>
</body>
</html>
آخرین ویرایش: 30-06-2015 ???? 20:32، توسط Behnam Designer
سوال برنامه نویسی دارید؟
ندونستن عیب نیست، نپرسیدن چرا!