jquery前段的具体使用实例
<!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; charset=gb2312" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title>走进售楼处</title>
<script src="jqueryui/js/jquery-1.8.3.js" type="text/javascript"></script>
<script src="jqueryui/js/jquery-ui-1.9.2.custom.min.js" type="text/javascript"></script>
<link href="jqueryui/css/ui-lightness/jquery-ui-1.9.2.custom.css" rel="stylesheet"
type="text/css" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link href="all.css" rel="stylesheet" type="text/css" />
<link href="ui-editor.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" language="javascript">
$(function () {
//初始化---start
$('.editContent').hide();
$('.ulContent li').each(function (index, element) {
var rel = $(this).attr('rel'); // 对应右边的内容的li的id
if ($(this).hasClass('hide')) {
$('.navHideShowBtn', '#' + rel).text('显示');
$('.nav-list', '#' + rel).removeClass('blockStatus').addClass('hideStatus');
}
else {
$('.navHideShowBtn', '#' + rel).text('隐藏');
$('.nav-list', '#' + rel).removeClass('hideStatus').addClass('blockStatus');
}
});
//初始化---end
//弹出层里面的取消按钮，主要是关闭弹出层---start
$('.cancelBtn').live('click',function(event){
$( "#dialogContent" ).dialog('close');
})
$('.editContentBtn').live('click',function(){
var id= $(this).attr('data');
var dialogTitlet = $(this).text();
var dialogHeight = parseInt($(this).attr('rel')) || 500;
$( "#dialogContent" ).dialog('close');
if($('.nav-list','#'+id).hasClass('hideStatus')){ alert('此模块已隐藏,不可编辑');return false;}
window.location.href='#c_'+id;
$( "#dialogContent" )
.html($('.editContent','#'+id).html())
.dialog('option','position',{ my: "left top", at: "right top", of: $('#a01') })
.dialog( "option", "height",dialogHeight)
.dialog( "option", "title",dialogTitlet)
.dialog('open');
$('.nav-list').removeClass('ui_check');
$('.nav-list','#'+id).addClass('ui_check');
})
//弹出层里面的取消按钮，主要是关闭弹出层---end
//弹出层---start
$( "#dialogContent" ).dialog({
dialogClass:'fixedPosition',
width:1000,
autoOpen:false,
draggable:false,
resizable:false,
modal:true,
buttons: {
'保存': function() {
alert('保存')
},
'取消': function() {
$( this ).dialog( "close" );
}
},
open:function(ui){
$(this).parent().css({'position':'fixed',top:0})
},
close:function(){
//$('#divMask').hide();
$('.nav-list').removeClass('ui_check');
}
})
//弹出层---end
//点击定位---end
//上下移动---start
$('.down').live('click', function () {
var id = $(this).attr('data');
var rel = $(this).attr('rel');
if ($('.nav-list', '#' + id).hasClass('hideStatus')) { alert("此模块已经隐藏不可编辑"); return false; }
downLi($('li.show#' + id));
downLi($('li.show#' + rel));
})
$('.up').live('click', function () {
var id = $(this).attr('data');
var rel = $(this).attr('rel');
if ($('.nav-list', '#' + id).hasClass('hideStatus')) { alert('此模块已隐藏不可编辑'); return false; }
upLi($('li.show#' + id));
upLi($('li.show#' + rel));
})
function upLi(value) {
var onthis = value;
var getUp = value.prev();
$(getUp).before(onthis);
}
function downLi(value) {
var onthis = value;
var getDown = value.next();
$(getDown).after(onthis);
}
//上下移动---end
//显示以及隐藏---start----ok
$('.navHideShowBtn').live('click', function () {
var id = $(this).attr('data');
var rel = $(this).attr('rel');
if ($(this).text() == '隐藏') {
$("#" + rel).removeClass('show').addClass('hide');
$('.navHideShowBtn', '#' + id).text('显示');
$('.nav-list', '#' + id).removeClass("blockStatus").addClass("hideStatus");
$('ul.ui_list', '#C_' + id).hide();
$("#dialogContent").dialog('close');
} else {
$("#" + rel).removeClass('hide').addClass('show');
$('.navHideShowBtn', '#' + id).text('隐藏');
$('.nav-list', '#' + id).removeClass('hideStatus').addClass('blockStatus');
$('ul.ui_list', '#C_' + id).show();
}
})
//显示以及隐藏---end
//弹出层---start
$('.editContentBtn').live('click', function () {
var id = $(this).attr('data');
$("#dialogContent").dialog('close');
if ($('.nav-list', '#' + id).hasClass('hideStatus')) { alert('此模块已隐藏,不可编辑'); return false; }
window.location.href = '#c_' + id;
if (id !== 'leftNav00' && id !== 'leftNav000') {
var height = $('.content', '#c_' + id).height(), top = $('.content', '#c_' + id).offset().top, left = $('.content', '#c_' + id).offset().left;
$('#divMask').css({ height: height, top: top, left: left }).show();
}
$("#dialogContent")
.html($('.editContent', '#c_' + id).html())
.dialog('option', 'position', { my: "left top", at: "right top", of: $('#a01') })
.dialog('open');
$('.nav-list').removeClass('ui_check');
$('.nav-list', '#' + id).addClass('ui_check');
})
$("#dialogContent").dialog({
dialogClass: 'fixedPosition',
width: 900,
height: 500,
appendTo: '#edit_left',
autoOpen: false,
draggable: false,
resizable: false,
modal: false,
open: function (ui) {
$(this).parent().css({ 'position': 'fixed', top: 0 })
},
close: function () {
$('#divMask').hide();
$('.nav-list').removeClass('ui_check');
}
})
//弹出层---end
//添加---start
$('.add').live('click', function () {
var id = $(this).attr('data');
if ($('.nav-list', '#' + id).hasClass('hideStatus')) { alert('此模块已隐藏,不可编辑'); return false; }
//$('div.nav-list','#'+id).toggleClass('blockStatus').toggleClass('hideStatus');
$('ul.ui_list', '#' + id).append('<li><a class="moudle"></a><a class="editContentBtn" data="' + id + '">导购模板块</a></li>');
})
//添加---end
//删除---start
$('.moudle').live('click', function () {
if (confirm("是否确定删除?")) { $(this).parent().remove(); }
})
//删除---end
//隐藏选项卡的其他选项 start
$('#ConB').hide();
$('#ConC').hide();
$('#ConD').hide();
$('.liCon').live('click',function(){
$('#ConA').hide();
$('#ConB').hide();
$('#ConC').hide();
$('#ConD').hide();
var id=$(this).attr('rel');
$('#'+id).show();
})
//隐藏选项卡的其他选项 end
});
</script>
</head>
<body>
<!--#include virtual="/public/site_nav/mini_nav.htm"-->
<!--banner b-->
<div id="dialogContent">
sgtfertretr</div>
<div class="container">
<!--内容 b-->
<div class="main">
<!--导航 b-->
<div class="nav">
<ul>
<li><a href="#c_a01">项目介绍</a></li>
<li><a href="#c_a02">外景展示</a></li>
<li><a href="#c_a03">内部展示</a></li>
<li><a href="#c_a04">团队风采</a></li>
<li><a href="#c_a05">样板间</a></li>
<li><a href="#c_a06">户型展示</a></li>
<li><a href="#c_a07">往期回顾</a></li>
</ul>
</div>
<!--导航 e-->
<div id="edit_left" class="edit_left">
<ul class="ulNav">
<!--通用设置块--start-->
<li class="show" id="a09">
<div class="nav-list">
<div class="navcon">
<a class="editContentBtn" data="a09">通用设置</a>
</div>
</div>
</li>
<!--通用设置块--end-->
<!--项目介绍标题块--start-->
<li class="show" id="a01">
<div class="nav-list blockStatus">
<div class="navcon">
<a class="editContentBtn" data="a01">项目介绍</a> <a class="up icon" data="a01" rel="c_a01"
title="向上"> </a> <a class="down icon" data="a01" rel="c_a01" title="向下"> </a>
</div>
<a class="status navHideShowBtn" data="a01" rel="c_a01">隐藏</a>
</div>
</li>
<!--项目介绍标题块--end-->
<!--样板间标题块--start-->
<li class="show" id="a05">
<div class="nav-list blockStatus">
<div class="navcon">
<a class="editContentBtn" data="a05">样板间</a> <a class="up icon" data="a05" rel="c_a05"
title="向上"> </a> <a class="down icon" data="a05" rel="c_a05" title="向下"> </a>
</div>
<a class="navHideShowBtn status" data="a05" rel="c_a05">隐藏</a>
</div>
</li>
<!--样板间标题块--end-->
<!--户型展示标题块--start-->
<li class="show" id="a06">
<div class="nav-list blockStatus">
<div class="navcon">
<a class="add icon" data="a06" title="增加模块"> </a> <a class="editContentBtn"
data="a06">户型解析</a> <a class="up icon" data="a06" rel="c_a06" title="向上"> </a>
<a class="down icon" data="a06" rel="c_a06" title="向下"> </a>
</div>
<a class="navHideShowBtn status" data="a06" rel="c_a06">隐藏</a>
</div>
<ul class="ui_list">
<!-- <li><a>导购模板块1</a></li>
<li><a>导购模板块2</a></li>-->
</ul>
</li>
<!--户型展示标题块--end-->
<!--内部展示标题块--start-->
<li class="show" id="a03">
<div class="nav-list blockStatus ">
<div class="navcon">
<a class="editContentBtn" data="a03">内部展示</a> <a class="up icon" data="a03" rel="c_a03"
title="向上"> </a> <a class="down icon" data="a03" rel="c_a03" title="向下"> </a>
</div>
<a class=" navHideShowBtn status " data="a03" rel="c_a03">隐藏</a>
</div>
</li>
<!--内部展示标题块--end-->
<!--外景展示标题块--start-->
<li class="show" id="a02">
<div class="nav-list blockStatus ">
<div class="navcon">
<a class="editContentBtn" data="a02">外景展示</a> <a class="up icon" data="a02" rel="c_a02"
title="向上"> </a> <a class="down icon" data="a02" rel="c_a02" title="向下"> </a>
</div>
<a class=" navHideShowBtn status " data="a02" rel="c_a02">隐藏</a>
</div>
</li>
<!--外景展示标题块--end-->
<!--团队风采标题块--start-->
<li class="show" id="a04">
<div class="nav-list blockStatus">
<div class="navcon">
<a class="editContentBtn" data="a04">团队风采</a> <a class="up icon" data="a04" rel="c_a04"
title="向上"> </a> <a class="down icon" data="a04" rel="c_a04" title="向下"> </a>
</div>
<a class="navHideShowBtn status" data="a04" rel="c_a04">隐藏</a>
</div>
</li>
<!--团队风采标题块--end-->
<!--往期回顾标题块--start-->
<li class="show" id="a07">
<div class="nav-list blockStatus">
<div class="navcon">
<a class="editContentBtn" data="a07">往期回顾</a> <a class="up icon" data="a07" rel="c_a07"
title="向上"> </a> <a class="down icon" data="a07" rel="c_a07" title="向下"> </a>
</div>
<a class="navHideShowBtn status" data="a07" rel="c_a07">隐藏</a>
</div>
</li>
<!--往期回顾标题块--end-->
<!--效果预览块--start-->
<li class="show" id="a10">
<div class="nav-list blockStatus">
<div class="navcon">
<a class="editContentBtn" data="a10">效果预览</a>
</div>
</div>
</li>
<!--效果预览块--end-->
<!--保存并发布块--start-->
<li class="show" id="a11">
<div class="nav-list blockStatus">
<div class="navcon">
<a class="editContentBtn" data="a11">保存并发布</a>
</div>
</div>
</li>
<!--保存并发布块--end-->
</ul>
</div>
<ul class="ulContent">
<!--走进售楼部标题 start-->
<li id="c_a08" class="show" rel="c_a08">
<div class="address">
<h1>
【戛纳湾金棕榈】</h1>
<div class="list">
<span class="xiangmu">项目地址：</span><span>厦门市集美区海滨达到与东安路交汇处（集美大桥下第一站）</span></div>
<div class="list">
<span class="tel">咨询电话：</span><span>400-700-1234转3015</span></div>
</div>
<div class="weibo">
<a href="###"> </a></div>
<div class="weixin">
<a href="###"> </a></div>
<style>
.p1 .content
{
overflow: auto;
zoom: 1;
}
#box
{
width: 100%;
}
#box ul
{
width: 366px;
float: left;
}
#box ul li
{
filter: Alpha(opacity=50);
width: 366px;
margin-bottom: 14px;
float: left;
heigth: 157px;
cursor: pointer;
opacity: 0.5;
}
#box ul li.current
{
filter: Alpha(opacity=100);
opacity: 1;
}
#box ul li img
{
width: 366px;
float: left;
height: 157px;
}
#box .show
{
display: block;
}
#box .hidden
{
display: none;
}
#pic
{
display: inline;
float: left;
margin-left: 14px;
}
#pic img
{
width: 549px;
float: left;
height: 498px;
}
</style>
</li>
<!--走进售楼部标题 end-->
<!--项目介绍内容块 start-->
<li id="c_a01" class="show" rel="c_a01">
<div class="p1">
<div class="title">
项目介绍</div>
<div class="content">
<div class="con">
<a href="###" target="_blank" class="fr img">
<img src="images/nopic.jpg" width="450" height="395" /></a>
<div class="fl article" style="line-height: 22px">
<p>
城主要的城市配套区，未来将成为亦庄未来将成为亦庄区域未来发展潜力大。亦庄新城，项目所处的市配套区，区域未来发展潜力大。富力盛悦居位于大兴区旧宫镇，地铁亦庄线旧宫兴区旧宫镇。
地铁亦庄线旧宫站往西400米，交通便利属名企开发项目，品质有保障；位于五环内区域站往西400米，交通便利属名企开发项目，品质有保障；位于五环内区域发展潜力大；但项目仅剩50年产权商住房源，且周边学校、医疗等配套档次不高，有待提升。腾讯房产带您一起对其进行深度了解。地铁亦庄线旧宫站往西400米，交通便利属名企开发项目，品质有保障；位于五环内区域站往西400米，交通便利属名企开发项目。品质有保障；位于五环内区域站往西400米，交通便利属名企开发项目。</p>
<div class="deinfo">
[项目位置]：高新区剑南大道与天府二街...
<br />
[售楼部地址]：成都金怡源房地产开发有限公司<br />
[资讯热线]：400-700-123转3015（黄先生）<br />
400-700-123转3015（张小姐）<br />
400-700-123转3015（售楼部）<br />
</div>
</div>
</div>
</div>
<!--浮动层 start-->
<div class="editContent">
<div class="contentSide">
<table width="98%" border="0" cellspacing="0" cellpadding="0" class="table_content ">
<tbody>
<tr>
<td colspan="2">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
</td>
<td align="right">
<input type="submit" name="button5" id="Submit5" value="新增项目介绍" />
<input type="button" name="button5" id="button26" value="删除" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>项目介绍:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text33" value="请输入项目名称或简称" />
<label for="checkbox">
</label>
直接输入项目名，或首简称
</td>
</tr>
<tr>
<td align="right">
<strong>项目介绍图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text34" value="图片链接，图片规格为205*155" />
</td>
</tr>
</tbody>
</table>
</div>
</div>
<!--浮动层 end-->
</div>
</li>
<!--项目介绍内容块 end-->
<!--p1 b-->
<!--样板间 start-->
<li id="c_a05" class="show" rel="c_a05">
<div class="p1" style="overflow: auto; zoom: 1">
<div id="box">
<ul>
<li class="current" onmouseover="change(1)">
<img src="images/nopic.jpg" />
</li>
<li onmouseover="change(2)">
<img src="images/nopic.jpg" />
</li>
<li onmouseover="change(3)">
<img src="images/nopic.jpg" />
</li>
</ul>
<div id="pic">
<a href="###">
<img src="images/nopic.jpg" /></a> <a href="###">
<img src="images/nopic.jpg" /></a> <a href="###">
<img src="images/nopic.jpg" /></a>
</div>
<script type="text/javascript">
function change(id) {
if (typeof (isround) != 'undefined') clearTimeout(isround);
var bigimg = document.getElementById("pic").getElementsByTagName("img");
var smallimg = document.getElementById("box").getElementsByTagName("li");
for (var i = 0; i < smallimg.length; i++) {
bigimg[i].className = "hidden";
smallimg[i].className = "";
}
bigimg[id - 1].className = "show";
smallimg[id - 1].className = "current";
if ((next = id + 1) > smallimg.length) {
next = 1;
}
isround = setTimeout('change(' + next + ')', 2500);
}
change(1);
</script>
</div>
</div>
</li>
<!--样板间 end-->
<!--p1 e-->
<!--p1 b-->
<!--p1 e-->
<!--p1 b-->
<!--户型解析内容块 start-->
<li id="c_a06" class="show" rel="c_a06">
<div class="p1 diff">
<div class="title">
<span class="fl">户型解析</span>
<ul class="ui-tab">
<li class="liCon" id="CA" rel="ConA" ><a class="check">户型A</a></li>
<li class="liCon" id="CB" rel="ConB"><a>户型B</a></li>
<li class="liCon" id="CC" rel="ConC"><a>户型A-1</a></li>
<li class="liCon" id="CD" rel="ConD"><a class="br">其他户型</a></li>
</ul>
</div>
<div class="content">
<div class="con" id="ConA">
<a href="###" target="_blank" class="fl img">
<img src="images/nopic.jpg" width="446" height="395" /></a>
<div class="fr article" style="padding-top: 5px">
<b class="huxing">户型点评：</b>
<p style="text-indent: 0">
户型：A-11-201-H<br />
风格：欧式简约<br />
点评：欧洲城主要的城市配套区，未来将成为亦庄未来将成为亦庄区域未来发展潜力大。亦庄新城，项目所处的市配套区，区域未来发展潜力大。富力盛悦居位于大兴区旧宫镇，地铁亦庄线旧宫兴区旧宫镇。</p>
<ul>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li class="pad"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li class="pad"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
</ul>
</div>
</div>
<!--户型BStart-->
<div class="con" id="ConB" >
<a href="###" target="_blank" class="fl img">
<img src="images/nopic.jpg" width="446" height="395" /></a>
<div class="fr article" style="padding-top: 5px">
<b class="huxing">户型点评：</b>
<p style="text-indent: 0">
户型：户型A<br />
风格：美式豪放<br />
点评：美国城主要的城市配套区，未来将成为亦庄未来将成为亦庄区域未来发展潜力大。亦庄新城，项目所处的市配套区，区域未来发展潜力大。富力盛悦居位于大兴区旧宫镇，地铁亦庄线旧宫兴区旧宫镇。</p>
<ul>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li class="pad"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li class="pad"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
</ul>
</div>
</div>
<!--户型BEnd-->
<!--户型A-1Start-->
<div class="con" id="ConC" >
<a href="###" target="_blank" class="fl img">
<img src="images/nopic.jpg" width="446" height="395" /></a>
<div class="fr article" style="padding-top: 5px">
<b class="huxing">户型点评：</b>
<p style="text-indent: 0">
户型：户型A-1<br />
风格：中式传统<br />
点评：中国城主要的城市配套区，未来将成为亦庄未来将成为亦庄区域未来发展潜力大。亦庄新城，项目所处的市配套区，区域未来发展潜力大。富力盛悦居位于大兴区旧宫镇，地铁亦庄线旧宫兴区旧宫镇。</p>
<ul>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li class="pad"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li class="pad"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
</ul>
</div>
</div>
<!--户型A-1End-->
<!--其他户型Start-->
<div class="con" id="ConD" >
<a href="###" target="_blank" class="fl img">
<img src="images/nopic.jpg" width="446" height="395" /></a>
<div class="fr article" style="padding-top: 5px">
<b class="huxing">户型点评：</b>
<p style="text-indent: 0">
户型：其他户型<br />
风格：华丽低调<br />
点评：中国城主要的城市配套区，未来将成为亦庄未来将成为亦庄区域未来发展潜力大。亦庄新城，项目所处的市配套区，区域未来发展潜力大。富力盛悦居位于大兴区旧宫镇，地铁亦庄线旧宫兴区旧宫镇。</p>
<ul>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li class="pad"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li class="pad"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="109" width="140" /></a></li>
</ul>
</div>
</div>
<!--其他户型End-->
<!--浮动层 start-->
<div class="editContent">
<table width="98%" border="0" cellspacing="0" cellpadding="0" class="table_content">
<tbody>
<tr>
<td colspan="2">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
</td>
<td align="right">
<input type="submit" name="button5" id="Submit4" value="新增户型解析" />
<input type="button" name="button5" id="button21" value="删除" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">户型解析A
</font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>户型解析:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text25" value="请输入户型名称或简称" />
<label for="checkbox">
</label>
直接输入楼盘名，或首简称,户型解析
</td>
</tr>
<tr>
<td align="right">
<strong>户型图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text26" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">户型解析B
</font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>户型解析:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text27" value="请输入户型名称或简称" />
<label for="checkbox">
</label>
直接输入楼盘名，或首简称,户型解析
</td>
</tr>
<tr>
<td align="right">
<strong>户型图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text28" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">户型解析C
</font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>户型解析:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text29" value="请输入户型名称或简称" />
<label for="checkbox">
</label>
直接输入楼盘名，或首简称,户型解析
</td>
</tr>
<tr>
<td align="right">
<strong>户型图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text30" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">户型解析D
</font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>户型解析:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text31" value="请输入户型名称或简称" />
<label for="checkbox">
</label>
直接输入楼盘名，或首简称,户型解析
</td>
</tr>
<tr>
<td align="right">
<strong>户型图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text32" value="图片链接，图片规格为205*155" />
</td>
</tr>
</tbody>
</table>
</div>
<!--浮动层 end-->
</div>
</div>
</li>
<!--户型解析内容块 end-->
<!--p1 e-->
<!--p1 b-->
<!--内部展示内容块 start -->
<li id="c_a03" class="show" rel="c_a03">
<div class="p1">
<div class="title">
内部展示</div>
<div class="content">
<ul class="imglist">
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="161" width="216" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="161" width="216" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="161" width="216" /></a></li>
<li class="nopa"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="161" width="216" /></a></li>
</ul>
</div>
<!--浮动层 start-->
<div class="editContent">
<table width="98%" border="0" cellspacing="0" cellpadding="0" class="table_content">
<tbody>
<tr>
<td colspan="2">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
</td>
<td align="right">
<input type="submit" name="button5" id="Submit3" value="新增内部展示" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">内部展示1： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text17" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>内部展示图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text18" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">内部展示2： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text19" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>内部展示图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text20" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">内部展示3： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text21" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>内部展示图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text22" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">内部展示4： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text23" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>内部展示图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text24" value="图片链接，图片规格为205*155" />
</td>
</tr>
</tr>
</tbody>
</table>
</div>
<!--浮动层 end-->
</div>
</li>
<!--内部展示内容块 end -->
<!--p1 e-->
<!--p1 b-->
<!--外景展示 start-->
<li id="c_a02" class="show" rel="c_a02">
<div class="p1">
<div class="title">
外景展示</div>
<div class="content">
<ul class="imglist">
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="161" width="216" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="161" width="216" /></a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="161" width="216" /></a></li>
<li class="nopa"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="161" width="216" /></a></li>
</ul>
</div>
<!--浮动层 start-->
<div class="editContent">
<table width="98%" border="0" cellspacing="0" cellpadding="0" class="table_content">
<tbody>
<tr>
<td colspan="2">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
</td>
<td align="right">
<input type="submit" name="button5" id="Submit2" value="新增外景展示" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">外景展示1： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text9" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>外景展示图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text10" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">外景展示2： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text11" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>外景展示图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text12" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">外景展示3： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text13" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>外景展示图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text14" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">外景展示4： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text15" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>外景展示图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text16" value="图片链接，图片规格为205*155" />
</td>
</tr>
</tbody>
</table>
</div>
<!--浮动层 end-->
</div>
</li>
<!--外景展示 end-->
<!--p1 e-->
<!--p1 b-->
<!--团队介绍 start-->
<li id="c_a04" class="show" rel="c_a04">
<div class="p1">
<div class="title">
团队风采</div>
<div class="content">
<div class="con">
<a href="###" target="_blank" class="fl img">
<img src="images/nopic.jpg" width="446" height="395" /></a>
<div class="fr article" style="padding-top: 5px">
<b class="tuandui">团队介绍：</b>
<p>
城主要的城市配套区，未来将成为亦庄未来将成为亦庄区域未来发展潜力大。亦庄新城，项目所处的市配套区，区域未来发展潜力大。富力盛悦居位于大兴区旧宫镇，地铁亦庄线旧宫兴区旧宫镇。区域未来发展潜力大。富力盛悦居位于大兴区旧宫镇，地铁亦庄线旧宫兴区旧宫镇。区域未来发展潜力大。富力盛悦居位于大兴区旧宫镇，地铁亦庄线旧宫兴区旧宫镇。</p>
<b class="tuandui02">团队合作：</b>
<p>
城主要的城市配套区，未来将成为亦庄未来将成为亦庄区域未来发展潜力大。亦庄新城，项目所处的市配套区，区域未来发展潜力大。富力盛悦居位于大兴区旧宫镇，地铁亦庄线旧宫兴区旧宫镇。区域未来发展潜力大。富力盛悦居位于大兴区旧宫镇，地铁亦庄线旧宫兴区旧宫镇。</p>
</div>
</div>
<ul class="imglist tuanimg">
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="151" width="151" /></a><a href="###" target="_blank"
class="name">销售经理：胡小麦</a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="151" width="151" /></a><a href="###" target="_blank"
class="name">销售经理：胡小麦</a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="151" width="151" /></a><a href="###" target="_blank"
class="name">销售经理：胡小麦</a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="151" width="151" /></a><a href="###" target="_blank"
class="name">销售经理：胡小麦</a></li>
<li class="nopa"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="151" width="151" /></a><a href="###" target="_blank"
class="name">销售经理：胡小麦</a></li>
</ul>
</div>
<!--浮动层 start-->
<div class="editContent">
<table width="98%" border="0" cellspacing="0" cellpadding="0" class="table_content">
<tbody>
<tr>
<td colspan="2">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
</td>
<td align="right">
<input type="submit" name="button5" id="Submit1" value="新增团队介绍" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">团队介绍 </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>团队介绍:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text1" value="请输入团队名称以及简洁" />
<label for="checkbox">
</label>
直接输入团队介绍
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>团队精神介绍:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text6" value="请输入团队精神" />
<label for="checkbox">
</label>
直接输入团队精神
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>团队成员描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text7" value="请输入团队成员描述" />
<label for="checkbox">
</label>
团队成员描述
</td>
</tr>
<tr>
<td align="right">
<strong>团队图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text2" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>团队成员描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text8" value="请输入图片团队成员描述" />
<label for="checkbox">
</label>
团队成员描述
</td>
</tr>
<tr>
<td align="right">
<strong>团队成员图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text3" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>团队成员描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text44" value="请输入图片团队成员描述" />
<label for="checkbox">
</label>
团队成员描述
</td>
</tr>
<tr>
<td align="right">
<strong>团队成员图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text4" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>团队成员描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text45" value="请输入图片团队成员描述" />
<label for="checkbox">
</label>
团队成员描述
</td>
</tr>
</tbody>
</table>
</div>
<!--浮动层 end-->
</div>
</li>
<!--团队介绍 end-->
<!--p1 e-->
<!--p1 b-->
<!--往期回顾 start-->
<li id="c_a07" class="show" rel="c_a07">
<div class="p1">
<div class="title">
往期回顾</div>
<div class="content">
<ul class="imglist wqimg">
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="200" width="270" /></a><a href="###" target="_blank"
class="name">走进龙湖：嘉峪城</a></li>
<li><a href="###" target="_blank">
<img src="images/nopic.jpg" height="200" width="270" /></a><a href="###" target="_blank"
class="name">走进龙湖：嘉峪城</a></li>
<li class="nopa"><a href="###" target="_blank">
<img src="images/nopic.jpg" height="200" width="270" /></a><a href="###" target="_blank"
class="name">走进龙湖：嘉峪城</a></li>
</ul>
</div>
<!--浮动层 start-->
<div class="editContent">
<table width="98%" border="0" cellspacing="0" cellpadding="0" class="table_content">
<tbody>
<tr>
<td colspan="2">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
</td>
<td align="right">
<input type="submit" name="button5" id="Submit6" value="新增往期回顾" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">往期回顾1： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text35" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>往期回顾图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text36" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">往期回顾2： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text37" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>往期回顾图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text38" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">往期回顾3： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text39" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>往期回顾图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text40" value="图片链接，图片规格为205*155" />
</td>
</tr>
<tr>
<td colspan="2">
<font style="color: #999">往期回顾4： </font>
</td>
</tr>
<tr>
<td width="100" align="right">
<strong>图片描述:</strong>
</td>
<td>
<input name="textfield9" type="text" class="input_200" id="text41" value="请输入图片描述" />
<label for="checkbox">
</label>
直接图片描述
</td>
</tr>
<tr>
<td align="right">
<strong>往期回顾图片:</strong>
</td>
<td>
<input name="textfield10" type="text" class="input_500" id="text42" value="图片链接，图片规格为205*155" />
</td>
</tr>
</tbody>
</table>
</div>
<!--浮动层 end-->
</div>
</li>
<!--往期回顾 end-->
<!--p1 e-->
</ul>
</div>
</div>
</body>
</html>
