-2
Ich habe einen Block, der einige Elemente hat. Ich habe getan, dass Elemente neue Stile erhalten, wenn ich diesem Block eine Klasse hinzufüge. SO, können Sie mir mit Code in jQuery helfen, die eine Klasse meinem "infoBlock" hinzufügen.Fügen Sie eine Klasse hinzu, wenn Sie auf die Schaltfläche klicken
Ihave ein, aber Notwendigkeit
li {
list-style-type: none;
}
.infoBlock {
\t display: block;
\t width: 520px;
\t height: 280px;
\t background: #fff;
\t margin: 50px 0 0 225px;
\t position: relative;
}
.infoBlock .more {
\t width: 180px;
\t height: 40px;
\t display: inline-block;
\t background: #5795f9;
\t text-decoration: none;
\t font: bold 16px Helvetica;
\t text-transform: uppercase;
\t padding: 10px ;
\t text-align: center;
\t margin: 20px 0 0 0;
color: #fff;
}
.infoBlock .person{
\t display: inline-block;
\t width: 25%;
}
.infoBlock .person img {
\t width: 80%;
\t margin: 20px 0 0 20px;
}
.infoBlock .person ul {
\t margin: 20px 0 0 20px;
}
.infoBlock .person .risk {
\t text-transform: uppercase;
\t color: #a6a6a6;
\t font: bold 15px Helvetica;
}
.infoBlock .person .level {
\t margin: 10px 0 0 ;
\t color: #ff8080;
\t font: bold 14px Helvetica;
}
.infoBlock .personDescription {
\t display: inline-block;
\t width: 74%;
\t position: absolute;
\t margin: 20px 0 0 20px;
}
.infoBlock .personDescription .name{
\t font:bold 20px Helvetica;
\t color: #a6a6a6;
\t margin: 0 0 20px;
}
.infoBlock .personDescription .position {
\t font: bold 15px Helvetica;
\t color: #5795f9;
\t margin: 0 0 25px;
}
.infoBlock .personDescription .description {
\t font: bold 14px Helvetica;
\t color: #a6a6a6;
}
.infoBlock .personDescription .description span {
\t color: #5795f9;
}
.infoBlock .personDescription .description .black {
\t color: #000;
}
.infoBlock .fullInfo {
\t display: none;
}
/* //////////////////////////// */
.infoBlock.f {
\t height: 480px;
}
.infoBlock.f .fullInfo {
\t display: block;
}
.infoBlock.f .person ul{
\t position: absolute;
\t margin: -115px 0 0 450px;
}
.infoBlock.f .personDescription .description {
\t display: none;
}
.infoBlock.f .border {
\t width: 80%;
\t height: 1px;
\t background-color: #a4a4a4;
\t margin: 10px 0 0 20px;
\t position: absolute;
}
.infoBlock.f .personDescription .more{
\t display: none;
}
.infoBlock.f .fullInfo {
\t position: absolute;
\t margin: 25px 0 0 25px;
}
.infoBlock.f .fullInfo .infoMenu li:hover {
\t color: #5795f9;
}
.infoBlock.f .fullInfo .infoMenu li{
\t display: inline;
\t margin:0 30px 0 0;
\t color: #a6a6a6;
\t font: bold 14px Helvetica;
\t cursor: pointer;
}
.infoBlock.f .fullInfo .scheme .schemeNumber {
\t margin: 20px 0 8px 30px;
\t font: bold 15px Arial;
\t color: #000;
}
.infoBlock.f .fullInfo .scheme .chance {
\t margin:0 0 10px 30px;
\t font: 16px Arial;
\t font-weight: 200;
\t color: #000;
}
.infoBlock.f .fullInfo .scheme table {
\t margin: 0 0 10px 28px;
}
.infoBlock.f .fullInfo .scheme table p {
\t font: bold 15px Helvetica;
}
.infoBlock.f .fullInfo .scheme table .type {
\t color: #a5a5a5;
\t font: 15px Helvetica;
}
.infoBlock.f .fullInfo .scheme .problem {
\t font: 16px Arial;
\t color: #a5a5a5;
\t margin: 0 0 20px 30px;
}
.infoBlock.f .fullInfo .scheme .more {
\t margin: 0 0 0 30px;
}<div class = "infoBlock">
<div class = "person">
<img src="img/1.jpg" alt = "">
<ul>
<li><p class = "risk">авыаыа:</p></li>
<li><p class = "level">Висоцуацуацуааукий</p></li>
<li></li>
</ul>
</div>
<div class = "personDescription">
<h2 class = "name">Василенко<br> Василь Антипович</h2>
<h4 class = "position">Авыпукпуфппук</h4>
<p class = "description">АВаываывавыпкупк <span>2х схем<br></span> на сумму більш ніж <span class = "black">3 млн. грн<span></p>
<a href="#" class = "more" >докладніше</a>
</div>
<div class = "fullInfo">
<ul class = "infoMenu">
<li>Схеми</li>
<li>Зв'язки</li>
<li>Додаткова інформація</li>
</ul>
<div class = "scheme">
<h3 class = "schemeNumber">Схема №1.1</h3>
<p class = "chance">Вірогідність - 93%</p>
<table>
<tr>
<td><p>Тип:</p></td>
<td><p class = "type">авыавыавыавыа</p></td>
</tr>
</table>
<p class = "problem">Квартира площею 123 кв. м записана<br> на Василенко М.В. (теща)</p>
<a href="#" class = "more f" >докладніше</a>
</div>
</div>
</div>
Es wird erwartet, dass Sie zumindest versuchen, diese für sich selbst zu codieren. Stack Overflow ist kein Code-Schreibdienst. Ich würde vorschlagen, dass Sie einige [** zusätzliche Forschung **] (http://meta.stackoverflow.com/questions/261592/how-much-research-effort-is-sected-of-stack-overflow-users) tun entweder über Google oder durch die Suche nach SO, versuchen und. Wenn Sie immer noch Probleme haben, kommen Sie zurück mit ** Ihrem Code ** und erklären Sie, was Sie versucht haben. –