Post
Ask Question
Ken H

Ken H

  • NA
  • 646
  • 354.8k

Show the current div layer in JQuery

Apr 21 2014 12:01 PM
Hello friend,
       How to display only the current div layer is clicked, instead of the whole show all.
 
My codes:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="jquery-1.9.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".panel").click(function () {
$(".flip").slideToggle("slow");
});
});
</script>
<style type="text/css">
div.panel,p.flip
{
margin:0px;
padding:5px;
text-align:center;
background:#e5eecc;
border:solid 1px #c3c3c3;
width:200px;
}
ul.flip
{
height:60px;
display:none;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:Literal ID="literal_1" runat="server"></asp:Literal>
</form>
</body>
</html>
cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Collections;
namespace WebApplication1
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e){
literal_1.Mode = LiteralMode.Encode;
literal_1.Mode = LiteralMode.Transform;
string strURL = "http://www.google.com";
string strURL2 = "http://www.csharpcorner.com";
string strURL3 = "http://www.codeproject.com";
literal_1.Text = @"<div class="+"panel"+">Module A<ul class="+"flip"+"><li><a href="+strURL+">Google</a></li>";
literal_1.Text += @"<li><a href=" + strURL3 + ">Code Project</a></li></ul></div><hr/>";
literal_1.Text += @"<div class=" + "panel" + ">Module B<ul class=" + "flip" + "><li><a href=" + strURL2 + ">C# Conver</a></li></ul></div><hr/>";
}
}
}
 
Thanks. 
 
 

Answers (2)