1
我想將div放在另一個下面，即文本測試應放置在地圖下方。我怎樣才能實現它？我想把內容放在地圖下面，但它不會在正確的位置呈現。我想要包含文本文本的div在地圖下方直接渲染，並且優先佔用所有空閒空間。如何做到這一點？爲什麼很清楚：兩者都不起作用？
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="UTF-8">
<meta name="keywords"
content="Houses Apartments, Vacation homes, Offices, Land, Flatmates,Paying Guest, Other real estate, Cars, Motorcycles, Accessories parts, Trucks, Other vehicles, Home Garden, Clothing, For Kids (Toys Clothes), Jewelry Watches, Hobbies, Sports Bicycles, Movies, Books Magazines, Pets, Tickets, Art Collectibles, Music Instruments, Computers Accessories, TV, Audio, Video, Cameras, Cellphones gadgets, Video games consoles, Job offers, Resumes, Services, Classes, Professional,Office equipment, Other, ">
<meta name="description"
content="Find jobs, cars, houses, mobile phones and properties for sale in your region conveniently. Find the best deal among {{count}} free ads online!">
<title>Free classifieds in India - Koolbusiness.com</title>
<link href="/static/css/koolindex_in.css?0.238133053892" rel="stylesheet" type="text/css">
<script type="text/javascript" src="/static/js/jquery-1.10.2.min.js?0.238133053892"></script>
</head>
<body>
<style xmlns="http://www.w3.org/2000/svg">
#visualization path:hover { fill: #fcafff;stroke:'#FFFFFF';strokeWidth:155; }
#visualization rect:hover {fill:transparent;stroke:'#FFFFFF';strokeWidth:155;}
</style>
<script type='text/javascript' src='http://www.google.com/jsapi'></script>
<script type='text/javascript'>
function drawMap() {
/*
var data = google.visualization.arrayToDataTable([
['Country', 'Projects'],
['Russia', 3],
['France', 2],
['Spain', 4]
]);*/
var data2 = google.visualization.arrayToDataTable([
['Country', 'Popularity'],
['Goa', 200],
['Gujarat', 300],['Andhra Pradesh', 200],
['Arunachal Pradesh', 300],['Assam', 200],
['Bihar', 300],['Chhattisgarh', 200],
['Gujarat', 300],['Goa', 200],
['Haryana', 300],['Himachal Pradesh', 200],
['Jammu and Kashmir', 300],['Jharkhand', 200],
['Karnataka', 300],['Kerala', 200],
['Madhya Pradesh', 300],['Maharashtra', 200],['Manipur', 300],['Meghalaya', 200],['Mizoram', 300],['Nagaland', 200],
['Orissa', 300],['Punjab', 200],
['Rajasthan', 300],
['Sikkim', 200],
['Tamil Nadu', 300],
['Tripura', 200],
['Uttaranchal', 300],['Uttar Pradesh', 200],
['West Bengal', 300],
['Delhi', 200],
['Lakshadweep', 300],
['Daman and Diu', 200],
['Dadra and Nagar Haveli', 300],['Chandigarh', 200],
['Pondicherry', 300],
['Andaman and Nicobar Islands', 200]
]);
var data = google.visualization.arrayToDataTable([
['Province'],
['Goa'],
['Gujarat'],
['Andhra Pradesh'],
['Arunachal Pradesh'],
['Assam'],
['Bihar'],
['Chhattisgarh'],
['Goa'],
['Gujarat'],
['Haryana'],
['Himachal Pradesh'],
['Jammu and Kashmir'],
['Jharkhand'],
['Karnataka'],
['Kerala'],
['Madhya Pradesh'],
['Maharashtra'],
['Manipur'],
['Meghalaya'],
['Mizoram'],
['Nagaland'],
['Orissa'],
['Punjab'],
['Rajasthan'],
['Sikkim'],
['Tamil Nadu'],
['Tripura'],
['Uttaranchal'],
['Uttar Pradesh'],
['West Bengal'],
['Delhi'],
['Lakshadweep'],
['Daman and Diu'],
['Dadra and Nagar Haveli'],
['Chandigarh'],
['Pondicherry'],
['Andaman and Nicobar Islands']
]);
var options = {
region:'IN',
/*colorAxis: {colors: ['#00853f', 'black', '#e31b23']},*/
//colorAxis: {minValue: 0, maxValue: 0, colors: []},
backgroundColor: '#81d4fa',
datalessRegionColor: '#ffc801',
width:450,
height:278,
resolution: 'provinces',
};
//options['colorAxis'] = { minValue : 0, maxValue : 1, colors : ['#FF0000','#0000FF']};
options['colors'] = ['#ffc801', '#ffc801', '#ffc801', '#ffc801', '#ffc801', '#ffc801', '#ffc801', '#ffc801', '#ffc801', '#ffc801'];
options['legend'] = 'none';
/*
var options = { dataMode: 'regions',
backgroundColor: {fill:'#FFFFFF',stroke:'#FFFFFF' ,strokeWidth:25 },
colorAxis: {minValue: 0, maxValue: 0, colors: []},
legend: 'none',
datalessRegionColor: '#ffc801',
displayMode: 'regions',
enableRegionInteractivity: 'true',
resolution: 'provinces',
sizeAxis: {minValue: 1, maxValue:1,minSize:10, maxSize: 10},
region:'IN',
keepAspectRatio: true,
width:450,
height:300,
tooltip: {textStyle: {color: '#444444'}, trigger:'focus', isHtml: false}
};*/
var container = document.getElementById('mapcontainer');
var chart = new google.visualization.GeoChart(container);
function myClickHandler(){
var selection = chart.getSelection();
var message = '';
for (var i = 0; i < selection.length; i++) {
var item = selection[i];
// if (item.row != null && item.column != null) {
message += '{row:' + item.row + ',column:' + item.column + '}';
//} else
if (item.row != null) {
message += '{row:' + item.row + '}';
//} else if (item.column != null) {
// message += '{column:' + item.column + '}';
}
}
if (message == '') {
message = 'nothing';
}
alert('You selected ' + message);
if (item.row==8) {
window.location = "/gujarat/";
}if (item.row==9) {
window.location = "/haryana/";
}
if (item.row==15) {
window.location = "/madhya_pradesh/";
}
if (item.row==16) {
window.location = "/maharashtra/";
}
if (item.row==22) {
window.location = "/punjab/";
}
if (item.row==23) {
window.location = "/rajasthan/";
}
if (item.row==28) {
window.location = "/uttar_pradesh/";
}
}
google.visualization.events.addListener(chart, 'select', myClickHandler);
chart.draw(data, options);
}
google.load('visualization', '1', {packages: ['geochart'], callback: drawMap});
/*
google.load('visualization', '1', {'packages': ['geochart']});
google.setOnLoadCallback(drawVisualization);
function drawVisualization() {var data = new google.visualization.DataTable();
data.addColumn('string', 'Country');
data.addColumn('number', 'Value');
data.addColumn({type:'string', role:'tooltip'});var ivalue = new Array();
var options = {
backgroundColor: {fill:'#FFFFFF',stroke:'#FFFFFF' ,strokeWidth:25 },
colorAxis: {minValue: 0, maxValue: 0, colors: []},
legend: 'none',
datalessRegionColor: '#ffc801',
displayMode: 'regions',
enableRegionInteractivity: 'true',
resolution: 'provinces',
sizeAxis: {minValue: 1, maxValue:1,minSize:10, maxSize: 10},
region:'IN',
keepAspectRatio: true,
width:450,
height:300,
tooltip: {textStyle: {color: '#444444'}, trigger:'focus', isHtml: false}
};
var chart = new google.visualization.GeoChart(document.getElementById('visualization'));
google.visualization.events.addListener(chart, 'select', function() {
var selection = chart.getSelection();
if (selection.length == 1) {
var selectedRow = selection[0].row;
var selectedRegion = data.getValue(selectedRow, 0);
if(ivalue[selectedRegion] != '') { document.location = ivalue[selectedRegion]; }
}
});
chart.draw(data, options);
}*/
</script>
<div id="wrapper">
<!--[if lt IE 7]>
<div class="alert-outer alert-error">
<a href="#" class="alert-closer" title="close this alert" onclick="removeIeNotification(this); return false;">×</a>
<div class="alert-inner">
<span><strong>You are using an outdated version of Internet Explorer.</strong> For a faster, safer browsing experience, upgrade today!</span>
</div>
</div>
<![endif]-->
<div class="main">
<div class="column_left">
<div class="box">
<ul>
<li>KoolBusiness is easy, free, and kool.</li>
<li>Buy and sell <a href="/india/cars-for_sale">cars</a>, check our <a href="/india/real_estate">real
estate</a>
section, find <a href="/india/jobs">jobs</a>, and much more.
</li>
<li>Check our <strong><a href="/india">0 ads online</a></strong> and find what you are looking for
in
your region or in all India.
</li>
</ul>
</div>
<div id="regions">
<div class="region_links_one">
<ul class="regions_one">
<li><a id="region_8" class="region" href="http://www.koolbusiness.com/andhra_pradesh/">Andhra
Pradesh</a></li>
<li><a id="region_9" class="region" href="http://www.koolbusiness.com/arunachal_pradesh/">Arunachal
Pradesh</a></li>
<li><a id="region_10" class="region"
href="http://www.koolbusiness.com/assam/">Assam</a>
</li>
<li><a id="region_11" class="region"
href="http://www.koolbusiness.com/bihar/">Bihar</a>
</li>
<li><a id="region_12" class="region"
href="http://www.koolbusiness.com/chhattisgarh/">Chhattisgarh</a></li>
<li><a id="region_13" class="region"
href="http://www.koolbusiness.com/goa/">Goa</a></li>
<li><a id="region_14" class="region" href="http://www.koolbusiness.com/gujarat/">Gujarat</a>
</li>
<li><a id="region_15" class="region" href="http://www.koolbusiness.com/haryana/">Haryana</a>
</li>
<li><a id="region_16" class="region" href="http://www.koolbusiness.com/himachal_pradesh/">Himachal
Pradesh</a></li>
<li><a id="region_17" class="region" href="http://www.koolbusiness.com/jammu_kashmir/">Jammu
&
Kashmir</a></li>
<li><a id="region_18" class="region" href="http://www.koolbusiness.com/jharkhand/">Jharkhand</a>
</li>
<li><a id="region_19" class="region" href="http://www.koolbusiness.com/karnataka/">Karnataka</a>
</li>
<li><a id="region_20" class="region" href="http://www.koolbusiness.com/kerala/">Kerala</a>
</li>
<li><a id="region_21" class="region" href="http://www.koolbusiness.com/madhya_pradesh/">Madhya
Pradesh</a></li>
</ul>
<ul class="regions_two">
<li><a id="region_22" class="region"
href="http://www.koolbusiness.com/maharashtra/">Maharashtra</a></li>
<li><a id="region_23" class="region" href="http://www.koolbusiness.com/manipur/">Manipur</a>
</li>
<li><a id="region_24" class="region" href="http://www.koolbusiness.com/meghalaya/">Meghalaya</a>
</li>
<li><a id="region_25" class="region" href="http://www.koolbusiness.com/mizoram/">Mizoram</a>
</li>
<li><a id="region_26" class="region" href="http://www.koolbusiness.com/nagaland/">Nagaland</a>
</li>
<li><a id="region_27" class="region" href="http://www.koolbusiness.com/orissa/">Orissa</a>
</li>
<li><a id="region_28" class="region" href="http://www.koolbusiness.com/punjab/">Punjab</a>
</li>
<li><a id="region_29" class="region" href="http://www.koolbusiness.com/rajasthan/">Rajasthan</a>
</li>
<li><a id="region_30" class="region" href="http://www.koolbusiness.com/sikkim/">Sikkim</a>
</li>
<li><a id="region_31" class="region" href="http://www.koolbusiness.com/tamil_nadu/">Tamil
Nadu</a></li>
<li><a id="region_32" class="region" href="http://www.koolbusiness.com/tripura/">Tripura</a>
</li>
<li><a id="region_34" class="region"
href="http://www.koolbusiness.com/uttaranchal/">Uttaranchal</a></li>
<li><a id="region_33" class="region" href="http://www.koolbusiness.com/uttar_pradesh/">Uttar
Pradesh</a></li>
<li><a id="region_35" class="region" href="http://www.koolbusiness.com/west_bengal/">West
Bengal</a></li>
</ul>
</div>
<div class="region_links_two">
<!-- ads here -->
<h2>Union territories</h2>
<ul class="regions_one">
<li><a class="region" href="http://www.koolbusiness.com/delhi/">Delhi</a></li>
<li><a class="region" href="http://www.koolbusiness.com/lakshadweep/">Lakshadweep</a></li>
<li><a class="region" href="http://www.koolbusiness.com/daman_diu/">Daman & Diu</a>
</li>
<li><a class="region" href="http://www.koolbusiness.com/dadra_nagar_haveli/">Dadra & Nagar
Haveli</a>
</li>
</ul>
<ul class="regions_two">
<li><a class="region" href="http://www.koolbusiness.com/chandigarh/">Chandigarh</a></li>
<li><a class="region" href="http://www.koolbusiness.com/pondicherry/">Pondicherry</a></li>
<li><a class="region" href="http://www.koolbusiness.com/andaman_nicobar_islands/">Andaman &
Nicobar
Islands</a></li>
</ul>
</div>
</div>
</div>
<div id="my_wrapper">
<div id="mapcontainer">
<div id='visualization'></div>
</div>
<div>
test
</div>
</div>
<footer class="nohistory columns">
<p class="first">A good deal is just around the corner!</p>
<p>KoolBusiness is the right choice for safe buying and selling in India: a free classifieds website where you
can buy and sell almost everything.</p>
<p><a href="/ai">Post an ad for free</a> or browse through our categories. You will find thousands of free
classifieds for cars, houses, mobile phones and gadgets, computers, pets and dozens of items and services in
your state or union territory.</p>
<p>
<strong>KoolBusiness does not charge any fee and does not require registration.</strong> Every
ad is checked so we can give you the highest quality possible for the ads on our site. That’s why
KoolBusiness is the most convenient, easiest to use and most complete free ads site in India.</p>
<div id="world_sites">
</div>
</footer>
</div>
</body>
</html>
的CSS可here。
什麼是'/靜態/ CSS/koolindex_in.css'？ – JClaspill 2015-03-31 18:34:31
你漂浮的元素？ – 2015-03-31 18:35:38