javascript jquery easyui layout 布局

你可以看下前臺(tái)的html機(jī)構(gòu) 后臺(tái)只要返回相應(yīng)格式的json數(shù)據(jù)然后動(dòng)態(tài)創(chuàng)建js創(chuàng)建html即可

創(chuàng)新互聯(lián)建站專注于古冶企業(yè)網(wǎng)站建設(shè),響應(yīng)式網(wǎng)站,電子商務(wù)商城網(wǎng)站建設(shè)。古冶網(wǎng)站建設(shè)公司,為古冶等地區(qū)提供建站服務(wù)。全流程定制網(wǎng)站制作，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，創(chuàng)新互聯(lián)建站專業(yè)和態(tài)度為您提供的服務(wù)

javascript調(diào)整網(wǎng)頁(yè)布局適應(yīng)不同分辨率的問(wèn)題

不多說(shuō)了，我估計(jì)你一看就明白了！！！！

script language="javascript"

window.onload=function(){

var main_j = document.documentElement.clientHeight-210;

document.getElementById('main_heigh').style.height = main_j + 'px';

var main_w = document.documentElement.clientWidth-202;

document.getElementById('main_heigh').style.width = main_w + 'px';

}

window.onresize=function(){

var main_j = document.documentElement.clientHeight-210;

document.getElementById('main_heigh').style.height = main_j +'px';

var main_w = document.documentElement.clientWidth-202;

document.getElementById('main_heigh').style.width = main_w + 'px';

}

/script

前端布局需要學(xué)習(xí)什么知識(shí)呀？

css、html和table。

前端布局使用css，即層疊樣式表，控制頁(yè)面的顯示。以前是使用table進(jìn)行布局的，但由于table布局不便于維護(hù)，每次修改的時(shí)候都需要更改頁(yè)面結(jié)構(gòu)。所以后來(lái)就逐漸被css所代替，在需要使用表格的時(shí)候才使用table。

除了要使用css之外，還要使用html。html用來(lái)表明頁(yè)面的結(jié)構(gòu)，css決定頁(yè)面結(jié)構(gòu)的顯示方式。

DIV+Javascript頁(yè)面布局

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""

html xmlns=""

head

meta http-equiv="Content-Type" content="text/html; charset=utf-8" /

title無(wú)標(biāo)題文檔/title

/head

body

script type="text/javascript"

function SH(){

if(document.getElementById("treeview").style.display=="block"){

document.getElementById("treeview").style.display="none";

document.getElementById("content").style.width="674px";

}else{

document.getElementById("treeview").style.display="block";

document.getElementById("content").style.width="474px";

}

}

/script

div style="width:700px; height:500px;"

div id="treeview" style="width:200px; height:500px; float:left; border:#000 1px solid; display:block"treeview/div

div id="c" style="width:20px; height:500px; float:left; border:#000 1px solid;"a href="#" onclick="SH()" style="width:20px; height:500px; display:block" title="點(diǎn)擊此處顯示或隱藏treeview"點(diǎn)擊此處顯示或隱藏/a/div

div id="content" style="width:474px; height:500px; float:left; border:#000 1px solid;"content/div

/div

/body

/html

javascript 自動(dòng)布局算法

將整個(gè)系統(tǒng)看做這樣一個(gè)物理系統(tǒng)：質(zhì)點(diǎn)和橡皮筋的系統(tǒng)；橡皮筋有個(gè)自然長(zhǎng)度Length，當(dāng)橡皮筋被拉長(zhǎng)時(shí)產(chǎn)生彈力T；任意2個(gè)質(zhì)點(diǎn)間存在反萬(wàn)有引力G（簡(jiǎn)單的說(shuō)就是質(zhì)量產(chǎn)生斥力，和物理系統(tǒng)相反）。當(dāng)斥力和彈力平衡的時(shí)候，布局就結(jié)束了，算法簡(jiǎn)單描述如下：

設(shè)系統(tǒng)為G(V,E);

for (vi in V) {

vi.x = random ();

vi.y = random ();

}

while (未平衡) {

for (ei(vx, vy) in E) {

Fx += T(ei, vx, vy);

Ty += T(ei, vy, vx);

}

for (vi in V) {

for (vj in V) {

if (i == j) 跳過(guò)

Fi += G (vi, vj);

}

}

for (fi in F) {

vi.x = |fi| * cos(fi.angle);

vi.y = |fi| * sin(fi.angle);

}

}

其中彈力公式T(e, vi, vj)遵循胡克定律：F = Length(e) Length ? K * (Length(e) - Length) : 0; K 為胡克常數(shù)，酌情取值

萬(wàn)有引力公式G(vi, vj)遵循牛頓萬(wàn)有引力定律，但方向相反:

F = -G * Mass(vi) * Mass(vj) / (Distance(vi, vj) * Distance(vi, vj)); G 為萬(wàn)有引力常數(shù)，酌情取值，Mass(v)為質(zhì)點(diǎn)v的質(zhì)量，可直接去定點(diǎn)的邊數(shù)；Distance(vi, vj)為質(zhì)點(diǎn)vi 和vj之間的距離，根據(jù)勾股定理可到。

系統(tǒng)平衡的標(biāo)準(zhǔn)：合彈力=合斥力，表現(xiàn)為v.x和v.y不再發(fā)生變化或震動(dòng)

注意：當(dāng)隨機(jī)初始化后，可能產(chǎn)生2個(gè)質(zhì)點(diǎn)重疊的現(xiàn)象，這時(shí)2質(zhì)點(diǎn)間的斥力可用常數(shù)替代，方向隨機(jī)。若質(zhì)點(diǎn)無(wú)質(zhì)量，可使用一個(gè)小常數(shù)替代，如.0005

名稱欄目：javascript布局,javascript頁(yè)面布局
標(biāo)題網(wǎng)址：http://chinadenli.net/article14/dsgosge.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供定制網(wǎng)站、網(wǎng)站建設(shè)、動(dòng)態(tài)網(wǎng)站、虛擬主機(jī)、網(wǎng)站導(dǎo)航、外貿(mào)網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)