网页设计:点击左侧标题,右侧显示相应内容

作者&投稿:敞泳 (若有异议请与网页底部的电邮联系)
html怎么设计 左侧是菜单栏,点击不同的菜单选项在右侧出现相应的内容?~

大致思路 左侧:菜单,给每个菜单设置id和onclick点击事件,onclick事件触发的函数假设写为display() 右侧:写个固定样式的div,id假设设置为board。 如果你的菜单内容在服务器 display()的实现如下 function display(){ $.ajax({ type: "POST", url: 菜单所请求的内容地址, data: this.id等等相关的请求标志, success: funtion(data){$('board').html(data)},//返回数据填充 dataType: dataType});} 如果菜单内容写死在页面内 那么右侧:写和菜单数一样多的div,把所有的display属性设置为none 同时display()的实现如下 function display(){ $('#'+$(this).attr('rel')).style.display='block';} 以上,伪代码,仅供参考

设置内部链接。

如果按你说的话,那就要用JavaScript了,在右侧的单元格里面设置多个div,没一个标题对于一个div,然后当单击左面的标题的时候把右面的对应div设置成显示的,其他的设置成隐藏的就行了,我用写一段代码,你试试
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<script type="text/javascript">
function funcShow(id){
for(var i=0;i<5;i++){
var divInfo =document.getElementById('div'+(i+1));
divInfo.style.display='none';
}
var div =document.getElementById('div'+id);
div.style.display='block';
}
</script>
</head>
<body>
<table width="632" border="1">
<tr>
<td width="66"><a href="javascript:funcShow(1)">1 </a></td>
<td width="550" colspan="4" rowspan="5">
<div id="div1" style="display:block">此处显示id "div1" 的内容</div>
<div id="div2" style="display:none">此处显示id "div2" 的内容</div>
<div id="div3" style="display:none">此处显示id "div3" 的内容</div>
<div id="div4" style="display:none">此处显示id "div4" 的内容</div>
<div id="div5" style="display:none">此处显示id "div5" 的内容</div></td>
</tr>
<tr>
<td><a href="javascript:funcShow(2)">2 </a></td>
</tr>
<tr>
<td><a href="javascript:funcShow(3)">3 </a></td>
</tr>
<tr>
<td><a href="javascript:funcShow(4)">4 </a></td>
</tr>
<tr>
<td><a href="javascript:funcShow(5)">5 </a></td>
</tr>
</table>

</body>
</html>
希望对你有帮助

用层实现,应该容易的很

用 ajax


word装订线在左侧怎么设置
具体如下:1. 首先,在Word中打开我们要进行操作的文档,然后再点击页面上端的“页面布局”。2. 接着,点击“页面设置”后的图标,如下图黄框标记处:3. 打开页面设置窗口后,点击上端的“页边距”。4. 进入页边距界面后,找到“装订线位置”,点击其后的下拉箭头,在弹出窗口中选择我们想要的位置。

如何在word中设计标签纸?
3. 在弹出的对话框中,选择“标签”选项卡,然后选择你所使用的标签纸型号。4. 确定选择后,点击“确定”按钮,此时Word的页面尺寸将会调整为所选标签纸的尺寸。5. 接下来,你可以根据需要在页面上插入文本、图片、表格等元素,设计你所需要的标签内容。6. 在插入元素后,可以使用“文本框”或“表格...

请教一个WORD模板是怎么设计的,我有截图,但是不知道怎么设计,我需要依...
第一步:设置模板。打开WORD界面,菜单栏→“文件”→“页面设置”,在“页面设置”对话框里先在“页边距”中点击“横向”那个图标,然后选点“纸张”按钮。在这里假设这个模板就是一张横向A4纸,页宽、页高都使用默认的,您可以根据实际需要,选择A3、B5、16开或者“自定义”纸张大小(输入实际数字)来...

厂牌模板图片素材-名片制作步骤
5单击“文件”菜单中的“页面设置”命令,按照名片纸194mm×295mm的尺寸设置,上下边距各为12.5mm,左右边距各为7mm。 6单击左边第一个标签框,右击该框,单击...1、页面设计,打开一个文件,选取“查看”中“全真模式”,按打印效果显示,并使光标处于原点选A4纸,页边距、上空、下空均为0。 2、定名片形状与大小单节...

新标签页设置为主页新标签页
进行添加;之后点击确定就行了。4、就成功的把百度添加到新标签的页面了。5、还可以设置要使用的搜索引擎点击搜索设置就行了。6、再就是要设置新标签页的背景,我们点击页面右上角的设置按钮.可以选择要添加的背景;在设置页面还可以设计页面格子的数量,比如我把格子取消,就可以设置为 0 个格子;这样...

word中,怎样将部分内容固定到下一页
将部分内容固定到下一页的方法是添加分页符,具体添加和使用的方法如下(以windows10系统的word2019版为例):1、打开word文档,点击上方的插入按钮。2、将光标定位到第一章末尾。3、在随后打开的界面中点击上方的“分页”按钮。4、随后即可看到第二页出现了空白,可以输入第二章的内容。而在第一页输入...

详情页模板怎么制作?淘宝天猫详情页如何制作怎么整理文案排版详情页
网店如何设计宝贝详情页网店设计宝贝详情页的方法是:1、首先打开页面,进入“我是卖家”、店铺管理、店铺装修,进入装修后台之后点击页面,找到宝贝详情页点击添加新模板。2、然后,需要新建一个详情页面模板,新建详情页面模板要根据同一类模板共同的说明来做。名称要明确,虽然买家看不到,为了方便管理,...

网页标题怎么设置html网页标题怎么设置
1、双击打开AxureRP8设计软件,在基本元件中拖曳一个矩形1到画布上。2、再次在基本元件里拖曳两个按钮到画布上,放在矩形框上方。3、再拖曳一个占位符到矩形框下方。4、在右侧属性里自适应勾选“启用”,弹出“影响所有视图”。5、点击左侧自适应按钮,弹出自适应视图,分别设置手机、平板和电脑分辨率的...

Indesign目录生成详细步骤,及页码前的点或线如何设置,要详细
2、点击下方新建按钮,新建一个段落样式,我们将其命名为“标题样式1”,并设置字体、字号属性。如有需要,可同时设置其他效果,如:缩进和间距、段落线等。3、如果需要多层次目录,按步骤2继续设置“标题样式2”...4、按步骤2设置“目录样式1”。打开左侧[制表符],添加一个右对齐的制表符,座标为...

怎样在word里设计书籍折叠页
4、在页面设置里面,将页面切换到纸张,在纸张大小里面选择A3,点击确定即可。打开word后,在“文件”选项下“页面设置”然后进行如下操作:1、选项卡“页边距”选择“横向”,多页下拉列表选择“书籍折页”,示:2、设置版式 在本次书籍制作中,我们将首页设计为封面页,因此首页就不需要页眉和页脚,...

乐都县17199251561: 网页设计:点击左侧标题,右侧显示相应内容
谷适前列: 如果按你说的话,那就要用JavaScript了,在右侧的单元格里面设置多个div,没一个标题对于一个div,然后当单击左面的标题的时候把右面的对应div设置成显示的,其他的设置成隐藏的就行了,我用写一段代码,你试试 &lt;!DOCTYPE HTML ...

乐都县17199251561: 当点击左边的标签时,如在右边显示相应的页面?
谷适前列: 使用框架,并设置左边框架的链接目标为右边框架. 可以在Dreamweaver中实现,相对要方便一些.

乐都县17199251561: 在网页中显示如图效果,左侧菜单可以展开和隐藏;点击左侧,右侧会显示相应内容. -
谷适前列: 自己去看下iframe吧 至于那个子菜单父菜单,其实就是显示隐藏的效果,自己用js控制下就好了

乐都县17199251561: asp 一个页面 如何能够实现点击左边的菜单栏 在右边显示相应的内容 不需要打开新窗口? -
谷适前列: 左边的菜单栏是独自的.asp文件吗 是就在新建一个页面 把那个菜单文件包含在该页面中 菜单栏链接到该页面 就可以显示了

乐都县17199251561: 单一静态网页如何实现点击左边菜单在右边展现内容 -
谷适前列: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html...

乐都县17199251561: 网页中怎么实现点击左边右边出现相应文字 -
谷适前列: 那是超链接,你可以去查下相关类容

乐都县17199251561: 我想知怎样做到在左边点击导航!右边显示相应的内容! -
谷适前列: 做成框架结构,把左边框架内建成相关的导航条,导航条的相关链接在下面有个选项,作用是选择你的链接区域.比如你用了模板框架中的“上方固定,左侧嵌套”模式,那么右下方就作为mainFrame,你在leftFrame中所建的链接就可以在“目...

乐都县17199251561: css页面设计,在一个页面上点左边项目连接只是右边出现相应内容其他内容不变.
谷适前列: 楼主说到的问题很久前我在Rachel Andrew的文章里面看过,不过不记得他的解决方案了,或者楼主可以到Rachel的个人主页看一看.我想了一下,如果不用js纯粹用css的话,或者可以从a标签的伪类做文章. a标签的伪类有 a:link a:visited a:...

乐都县17199251561: 请问一下:就是一般的网站,在网站的左边点击,右边显示相应的页面的那样的网站是用什么技术实现的? -
谷适前列: 左侧是一个菜单 右侧用iframe调用不同页面就可以了

乐都县17199251561: 单一静态网页如何实现点击左边菜单在右边展现内容
谷适前列: &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;&lt;head&gt;&lt;meta http-equiv="Content-Type" ...

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 星空见康网