5
tôi có một pagethay đổi kích thước thành phần của jquery.knob.js lib
sau khi bạn nhấn nút, bạn sẽ thấy yếu tố jquery.knob.js lib (khoanh tròn) tôi muốn kích thước vòng tròn thay đổi ot và tôi đã viết này mã:
<div style="float:left; width:255px; height:155px">
<input class="knob" data-fgColor="#9dc806" data-cgColor="black" data-bgColor="#7d7d7d" data-tickColor="black" data-thickness=".25" data-readOnly=true value="<?php echo $percent; ?>">
</div>
nhưng nếu tôi thay đổi chiều rộng và chiều cao của div, kích thước vòng tròn không thay đổi?
Tất cả các trang mã của pb.php:
<?php
header('Content-Type: text/html; charset=utf-8');
include '../connect.php';
include '../ProcessingMySQL.php';
$mysqli = new ProcessingMySQL($hostname, $user_name, $password, $db_name);
$site = $_POST['sites'];
$percent = $mysqli->getPercentTopQuery($site);
?>
<html>
<head>
<style type="text/css">
.knob{color:#000000 !important;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script src="js/jquery.knob.js"></script>
<script>
$(function() {
$(".knob").knob();
var val,up=0,down=0,i=0
,$idir = $("div.idir")
,$ival = $("div.ival")
,incr = function() { i++; $idir.show().html("+").fadeOut(); $ival.html(i); }
,decr = function() { i--; $idir.show().html("-").fadeOut(); $ival.html(i); };
$("input.infinite").knob(
{
'min':0
,'max':20
,'stopper':false
,'change':function(v){
if(val>v){
if(up){
decr();
up=0;
}else{up=1;down=0;}
}else{
if(down){
incr();
down=0;
}else{down=1;up=0;}
}
val=v;
}
}
);
$('.knob').val($('.knob').val() + '%');
});
</script>
<style>
h2{color:#87CEEB;font-family:'Georgia';}
</style>
</head>
<body>
<h1>Процент запросов в топе для сайта <?php echo $site; ?></h1>
<div style="float:left; width:255px; height:155px">
<input class="knob" data-fgColor="#9dc806" data-cgColor="black" data-bgColor="#7d7d7d" data-tickColor="black" data-thickness=".25" data-readOnly=true value="<?php echo $percent; ?>">
</div>
</body>
</html>