GAAP Membre
by matmat
HTML
<div style="padding:10px;width:535px;">
<div id="MainContent">
<div class="menutopWL">
<span style="float:left;margin-right:0px!important;"><img style="background:transparent;" alt="" /></span>
<h6 style="margin-bottom:5px;display:inline-block;">John Calagan</h6>
<a style="color:#ff7000;font-family:Constantia,Palatino,serif;font-style: italic;">Application Brocante </a>
</div>
<div class="contenuWL">
<div class="ligneSAGAmenu">
<p>Filtrer par<span><select><option>-- Catégorie --</option></select></span>
</p>
<p>Trier par<span><select><option>Date</option><option>Prix</option></select></span>
</p>
</div>
<div class="ligneWL1" style="border-bottom:none;
">
<span style="text-align:center; width=100%; float:left;cursor:default;">
Pages:1
</span>
<a href="#" title="Détailler / Condenser tout" id="detailmembreWL"><span style="border:none;">Détailler tout / Condenser tout</span><img src="/Images/Icones/arrowdown.png" style="background:transparent;" alt="" data-etat="0" /></a>
</div>
<div class="ligneSAGA1">
<div class="ligneSAGA1-1"> <span> Corvette 1974 stingray </span>
</div>
<div class="ligneSAGA1-2"> <span>Auto-Moto / Collection </span>
</div>
</div>
<div class="ligneSAGA1" style="height:153px;">
<div class="ligneSAGA1-3"> <a> <img alt="ahah"/></a>
</div>
<div class="ligneSAGA1-4">
<div class="ligneSAGA1-5">
<div class="ligneSAGA1-6">
<p class="prix">1200 €</p>
</div>
<div class="ligneSAGA1-6">
<p>84240 - La tour d'aigues</p>
</div>
</div>
<div...
CSS
.ligneSAGAmenu {
width:100%;
font-family: Constantia, Palatino, serif;
height:40px;
padding:0px;
margin:0px;
margin-top:15px;
}
.ligneSAGAmenu p {
display:inline-block;
width:40%;
margin-left:20px;
color:grey;
font-family:Constantia, Palatino, serif;
font-size:14px;
}
.ligneSAGAmenu span {
margin-left:10px;
font-family:Constantia, Palatino, serif;
}
.ligneSAGAmenu select {
font-family:Calibri;
font-style:italic;
border:solid 1px #ddf;
padding-left:4px;
width:140px;
font-size:14px;
color:grey;
}
.outer2 {
padding-left: 23px;
padding-bottom:5px;
position: relative;
height:auto;
width:100%;
min-height:100px;
background:white;
}
.inner2 {
left:0;
position:absolute;
height:100%;
width:15px;
border-right: 1px solid grey;
border-top: 1px solid grey;
background:#ddf;
}
.inner2:hover {
background:grey;
border:1px solid #FF7000;
}
.inner4 {
width:94%;
background:white;
min-height:100px;
border-bottom: 1px solid #F5E6E6;
}
.inner4 img {
width:80px;
height:80px;
}
.inner4 a {
width:31.5%;
text-align:center;
display:inline-block;
height:100px;
line-height:100px;
}
.inner5 {
margin-top:5px;
width:100%;
background:white;
font-family:calibri;
font-size:14px;
padding-bottom:10px;
}
.inner6 {
margin-top:5px;
width:90%;
background:white;
font-family:calibri;
font-size:14px;
margin-bottom:10px;
text-align:center;
color:#FF7000;
}
.contenuWL {
vertical-align: middle;
display: inline-block;
margin-top:10px;
margin-bottom:20px;
width:100%;
margin-right:auto;
margin-left:auto;
overflow:hidden;
min-height :300px;
background-color:#F7F7FF;
border:1px solid #F5E6E6;
border-radius:0px 30px 0px 30px;
padding-bottom:30px;
box-shadow: 1px 1px 3px #808080;
opacity:0.92;
filter:...
JavaScript
$(document).ready(function (m) {
$(document.body).on('click', '.ligneSAGA1-8', function (event) {
var element = $(this).attr('id');
var arr = element.split('_');
var id = arr[1];
var tp = '#tp_' + id;
$(tp).toggle('slow');
});
$(document.body).on('click', '.inner2', function (event) {
var element = $(this).attr('id');
var arr = element.split('_');
var id = arr[1];
var tp = '#tp_' + id;
$(tp).toggle('slow');
event.preventDefault;
return false;
});
$(document.body).on('hover', '.inner2', function (event) {
});
});