2
我有一個下拉列表，它有一個滾動條。我想更改此滾動條的顏色。 您可以從DEMO中查看工作代碼。 我的代碼是dropdownlist的滾動條顏色變化
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.1.319/js/kendo.all.min.js"></script>
<link href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.common.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.default.min.css" rel="stylesheet" />
<script>
</script>
</head>
<body>
<div id="example" class="k-content">
<div class="demo-section">
<h2>View Order Details</h2>
<p>
<label for="categories">Categories:</label><input id="categories" style="width: 300px" />
</p>
<p>
<label for="products">Products:</label><input id="products" disabled="disabled" style="width: 300px" />
</p>
<p>
<label for="orders">Orders:</label><input id="orders" disabled="disabled" style="width: 300px" />
</p>
<button class="k-button" id="get">View Order</button>
</div>
<style scoped>
.demo-section {
width: 460px;
padding: 30px;
}
.demo-section h2 {
text-transform: uppercase;
font-size: 1.2em;
margin-bottom: 30px;
}
.demo-section label {
display: inline-block;
width: 120px;
padding-right: 5px;
text-align: right;
}
.demo-section .k-button {
margin: 20px 0 0 125px;
}
.k-readonly
{
color: gray;
}
</style>
<script>
$(document).ready(function() {
var categories = $("#categories").kendoDropDownList({
optionLabel: "Select category...",
dataTextField: "CategoryName",
dataValueField: "CategoryID",
dataSource: {
type: "odata",
serverFiltering: true,
transport: {
read: "http://demos.kendoui.com/service/Northwind.svc/Categories"
}
}
}).data("kendoDropDownList");
var products = $("#products").kendoDropDownList({
autoBind: false,
cascadeFrom: "categories",
optionLabel: "Select product...",
dataTextField: "ProductName",
dataValueField: "ProductID",
dataSource: {
type: "odata",
serverFiltering: true,
transport: {
read: "http://demos.kendoui.com/service/Northwind.svc/Products"
}
}
}).data("kendoDropDownList");
var orders = $("#orders").kendoDropDownList({
autoBind: false,
cascadeFrom: "products",
optionLabel: "Select order...",
dataTextField: "Order.ShipCity",
dataValueField: "OrderID",
dataSource: {
type: "odata",
serverFiltering: true,
transport: {
read: "http://demos.kendoui.com/service/Northwind.svc/Order_Details?$expand=Order"
}
}
}).data("kendoDropDownList");
$("#get").click(function() {
var categoryInfo = "\nCategory: { id: " + categories.value() + ", name: " + categories.text() + " }",
productInfo = "\nProduct: { id: " + products.value() + ", name: " + products.text() + " }",
orderInfo = "\nOrder: { id: " + orders.value() + ", name: " + orders.text() + " }";
alert("Order details:\n" + categoryInfo + productInfo + orderInfo);
});
});
</script>
</div>
</body>
</html>*
我怎樣才能改變這種sropdown列表的滾動條的顏色？
你現在有多少次重複這個問題？你的假選擇列表被包裹在一個div中。如果你真的想要你可以找到一種方法來僞造div的滾動條，就像jscrollpane那樣。 – louisbros 2013-04-11 10:24:18