Grupa: Viesis

UWM FORUMS · PORTFOLIO · VIETŅU TOP
JAUNĀKAIS FORUMĀ · BIEDRU SARAKSTS · INFO MEKLĒTĀJS · IZSEKOTĀS TĒMAS · NOBALSO


Ierakstus pievienot var tikai reģistrējies lietotājs!
  UWM AKTUĀLI: DISKUSIJA: Reputācijas restarts - DISKUSIJA: Steam spēļu izloze - NODERĪGI: "CW sistēma" uCoz modulī
  • Lappuse 1 no 1
  • 1
uWM // FORUMS » uWEBMEISTARS // WEBLAPU PLATFORMAS » WEBLAPU APLIKĀCIJAS, SKRIPTI, SPRAUDŅI » uCoz » Matereālu izskats kino jaunumiem, rakstiem un tamlīdzīgi
Matereālu izskats kino jaunumiem, rakstiem un tamlīdzīgi
Antikrists
Otrdiena, 07.02.2017, 4:23:12 | Ieraksts #1
FORUMA APSARGS
Foruma ieraksti: 602

UWM Reputācija:

uWEBMEISTARS ordeņi:

1. līmenis

2. līmenis

3. līmenis


Jaunākie apbalvojumi:


@Antikrists raksta .. :

Matereālu izskata divi veidi jebkādam saturam, var izmantot kā informeri.

Kā tas ir šajā gadijumā matereālu izskati pielāgoti savām vajadzībām kā informeri.

Code
<div class="primary">
<div class="internal">
<?if($MODER_PANEL$)?><div style="float:right; margin: 5px 5px 0 0;">$MODER_PANEL$</div><?endif?>
<div class="cover" style="background-image: url('$IMG_URL1$')">
<span class="headline">$TITLE$<br><br></span>
<span class="category" style="left: 2px; bottom: 5px;">$CATEGORY_NAME$</span>

<span class="category" style="right: 2px; bottom: 5px;">
<span class="tooltip">Info

<em>Skatijumi: $READS$<br>Reitings: $RATING$<br>Komentāri: $COMMENTS_NUM$<i></i></em></span></span>
<div class="rear" onclick="location.href='$ENTRY_URL$'">

<span class="subrear"><center>$MESSAGE$</center></span>

</div></div></div>

<style type="text/css">
.internal {
display: block;
width: 97%;
float: left;
margin: 0.65%;
}
.cover {
display: block;
position: relative;
padding-bottom: 135%;
background-size: 100% 100%;
-moz-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
box-shadow:0 5px 5px #000000;
-moz-box-shadow:0 5px 5px #000000;
-webkit-box-shadow:0 5px 5px #000000;
}
.headline {
position: absolute;
top: 5px;
left: 0;
right: 0;
height: 26px;
overflow: hidden;
text-transform: uppercase;
font-family: Impact;
font-size: 12px;
font-weight: 500;
color: #CCCCCC;
text-align: center;
padding: 0 2px 4px 2px;
background: rgba(0, 0, 0, 0.55);
box-shadow:0 2px 3px #000000;
-moz-box-shadow:0 2px 3px #000000;
-webkit-box-shadow:0 2px 3px #000000;
}
.rear {
z-index: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
-moz-opacity: 0;
-khtml-opacity: 0;
opacity: 0;
overflow: hidden;
cursor: pointer;
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.rear:hover {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1)";
filter: alpha(opacity=1);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
}
.subrear {
position: absolute;
top: 30px;
left: 2px;
right: 2px;
bottom: 28px;
overflow: hidden;
background: rgba(0, 0, 0, 0.45);
font-family: Arial;
font-style: italic;
font-size: 12px;
color: #FFFFFF;
padding: 2px;
text-align: left;
}
.rear b {
position: absolute;
left: 5px;
bottom: 5px;
text-transform: uppercase;
font-family: Impact;
font-size: 12px;
font-weight: 500;
color: #CCCCCC;
background: rgba(0, 0, 0, 0.85);
padding: 1px 5px;
box-shadow:0 2px 3px #000000;
-moz-box-shadow:0 2px 3px #000000;
-webkit-box-shadow:0 2px 3px #000000;
-webkit-transition: all 1.5s linear;
-moz-transition: all 1.5s linear;
-o-transition: all 1.5s linear;
-ms-transition: all 1.5s linear;
transition: all 1.5s linear;
transform: rotateY(-90deg);
-webkit-transform: rotateY(-90deg);
-moz-transform: rotateY(-90deg);
-ms-transform: rotateY(-90deg);
-o-transform: rotateY(-90deg);
}
.rear b a {
color: #4444CCCCCC;
text-decoration: none;
}
.rear:hover b {
transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);
-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
-o-transform: rotateY(0deg);
}
.category {
position: absolute;
text-transform: uppercase;
font-family: Impact;
font-size: 12px;
font-weight: 500;
color: #CCCCCC;
background: rgba(0, 0, 0, 0.55);
padding: 1px 5px;
animation: increase 1.5s linear;
-webkit-animation: increase 1.5s linear;
-moz-animation: increase 1.5s linear;
-o-animation: increase 1.5s linear;
-ms-animation: increase 1.5s linear;
}
@keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-webkit-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-moz-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-o-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-ms-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
.tooltip {
z-index: 5;
position: relative;
cursor: pointer;
}
.tooltip em {
display: none;
}
.tooltip:hover em {
font-style: normal;
display: block;
position: absolute;
background: rgba(0, 0, 0, 0.65);
color: #4444CCCCCC;
padding: 3px 5px;
bottom: 22px;
right: 0;
width: 100px;
box-shadow: 0 0 5px #363636;
border-radius: 5px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-webkit-box-shadow: 0 0 5px #363636;
-moz-box-shadow: 0 0 5px #363636;
}
.tooltip:hover em i {
position: absolute;
bottom: -7px;
right: 5px;
border-top: 7px solid #000;
border-left: 7px solid transparent;
display: block;
}
@media all and (max-width: 640px) {
.internal {
width: 48%;
margin: 1%;
}
</style>

Orģināls ar 2 kolonām.

Code
<div class="internal">
<?if($MODER_PANEL$)?><div style="float:right; margin: 5px 5px 0 0;">$MODER_PANEL$</div><?endif?>
<div class="cover" style="background-image: url('$IMG_URL1$')">
<span class="headline">$TITLE$</span>
<span class="category" style="left: 2px; bottom: 5px;">$CATEGORY_NAME$</span>
<span class="category" style="right: 2px; bottom: 5px;">
<span class="tooltip">INFO<em>Skatijumi: $READS$<br>Reitings: $RATING$<br>Komentāri: $COMMENTS_NUM$<i></i></em></span></span>   
<div class="rear" onclick="location.href='$ENTRY_URL$'">
<span class="subrear">$MESSAGE$</span>
<b><a href="$PROFILE_URL$">$USERNAME$</a> | $DATE$</b>
</div></div></div>

<style type="text/css">
.internal {
display: block;
width: 48%;  
float: left;
margin: 1%;
}
.cover {
display: block;
position: relative;
padding-bottom: 62%;
background-size: 100% 100%;
-moz-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
box-shadow:0 5px 5px #000000;
-moz-box-shadow:0 5px 5px #000000;
-webkit-box-shadow:0 5px 5px #000000;
}
.headline {
position: absolute;
top: 5px;
left: 0;
right: 0;
height: 16px;
overflow: hidden;    
text-transform: uppercase;    
font-family: Impact;
font-size: 12px;
font-weight: 500;
color: #CCCCCC;
text-align: center;
padding: 0 2px 4px 2px;
background: rgba(0, 0, 0, 0.55);
box-shadow:0 2px 3px #000000;
-moz-box-shadow:0 2px 3px #000000;
-webkit-box-shadow:0 2px 3px #000000;
}
.rear {
z-index: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
-moz-opacity: 0;
-khtml-opacity: 0;
opacity: 0;
overflow: hidden;
cursor: pointer;
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.rear:hover {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1)";
filter: alpha(opacity=1);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
}
.subrear  {
position: absolute;
top: 30px;
left: 2px;
right: 2px;
bottom: 28px;
overflow: hidden;  
background: rgba(0, 0, 0, 0.45);
font-family: Arial;
font-style: italic;
font-size: 12px;
color: #FFFFFF;
padding: 2px 3px;
text-align: left;
}
.rear b {
position: absolute;
left: 5px;
bottom: 5px;
text-transform: uppercase;
font-family: Impact;
font-size: 12px;
font-weight: 500;
color: #CCCCCC;
background: rgba(0, 0, 0, 0.85);
padding: 1px 5px;
box-shadow:0 2px 3px #000000;
-moz-box-shadow:0 2px 3px #000000;
-webkit-box-shadow:0 2px 3px #000000;
-webkit-transition: all 1.5s linear;
-moz-transition: all 1.5s linear;
-o-transition: all 1.5s linear;
-ms-transition: all 1.5s linear;
transition: all 1.5s linear;
transform: rotateY(-90deg);
-webkit-transform: rotateY(-90deg);
-moz-transform: rotateY(-90deg);
-ms-transform: rotateY(-90deg);
-o-transform: rotateY(-90deg);
}
.rear b a {
color: #CCCCCC;
text-decoration: none;
}
.rear:hover b {
transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);
-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
-o-transform: rotateY(0deg);
}
.category {
position: absolute;
text-transform: uppercase;
font-family: Impact;
font-size: 12px;
font-weight: 500;
color: #CCCCCC;
background: rgba(0, 0, 0, 0.55);
padding: 1px 5px;
animation: increase 1.5s linear;
-webkit-animation: increase 1.5s linear;
-moz-animation: increase 1.5s linear;
-o-animation: increase 1.5s linear;
-ms-animation: increase 1.5s linear;
}    
@keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-webkit-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-moz-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-o-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-ms-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
.tooltip {
z-index: 5;    
position: relative;
cursor: pointer;
}
.tooltip em {
display: none;
}
.tooltip:hover em {
font-style: normal;
display: block;
position: absolute;
background: rgba(0, 0, 0, 0.65);
color: #CCCCCC;
padding: 3px 5px;
bottom: 22px;
right: 0;
width: 100px;
box-shadow: 0 0 5px #363636;
border-radius: 5px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-webkit-box-shadow: 0 0 5px #363636;
-moz-box-shadow: 0 0 5px #363636;
}
.tooltip:hover em i {
position: absolute;
bottom: -7px;
right: 5px;
border-top: 7px solid #000;
border-left: 7px solid transparent;
display: block;
}
@media all and (max-width: 480px) {
.internal {
width: 98%;  
float: none;
margin: 1%;    
}   
</style>


Orģināls ar 3 kolonām.

Code


<div class="internal">
<?if($MODER_PANEL$)?><div style="float:right; margin: 5px 5px 0 0;">$MODER_PANEL$</div><?endif?>
<div class="cover" style="background-image: url('$IMG_URL1$')">
<span class="headline">$TITLE$</span>
<span class="category" style="left: 2px; bottom: 5px;">$CATEGORY_NAME$</span>
<span class="category" style="right: 2px; bottom: 5px;">
<span class="tooltip">INFO<em>Skatijumi: $READS$<br>Reitings: $RATING$<br>Komentāri: $COMMENTS_NUM$<i></i></em></span></span>  
<div class="rear" onclick="location.href='$ENTRY_URL$'">
<span class="subrear">$MESSAGE$</span>
<b><a href="$PROFILE_URL$">$USERNAME$</a> | $DATE$</b>
</div></div></div>

<style type="text/css">
.internal {
display: block;
width: 32%;  
float: left;
margin: 0.65%;
}
.cover {
display: block;
position: relative;
padding-bottom: 135%;
background-size: 100% 100%;
-moz-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
box-shadow:0 5px 5px #000000;
-moz-box-shadow:0 5px 5px #000000;
-webkit-box-shadow:0 5px 5px #000000;
}
.headline {
position: absolute;
top: 5px;
left: 0;
right: 0;
height: 16px;
overflow: hidden;    
text-transform: uppercase;    
font-family: Impact;
font-size: 12px;
font-weight: 500;
color: #CCCCCC;
text-align: center;
padding: 0 2px 4px 2px;
background: rgba(0, 0, 0, 0.55);
box-shadow:0 2px 3px #000000;
-moz-box-shadow:0 2px 3px #000000;
-webkit-box-shadow:0 2px 3px #000000;
}
.rear {
z-index: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
-moz-opacity: 0;
-khtml-opacity: 0;
opacity: 0;
overflow: hidden;
cursor: pointer;
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.rear:hover {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1)";
filter: alpha(opacity=1);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
}
.subrear  {
position: absolute;
top: 30px;
left: 2px;
right: 2px;
bottom: 28px;
overflow: hidden;  
background: rgba(0, 0, 0, 0.45);
font-family: Arial;
font-style: italic;
font-size: 12px;
color: #FFFFFF;
padding: 2px;
text-align: left;
}
.rear b {
position: absolute;
left: 5px;
bottom: 5px;
text-transform: uppercase;
font-family: Impact;
font-size: 12px;
font-weight: 500;
color: #CCCCCC;
background: rgba(0, 0, 0, 0.85);
padding: 1px 5px;
box-shadow:0 2px 3px #000000;
-moz-box-shadow:0 2px 3px #000000;
-webkit-box-shadow:0 2px 3px #000000;
-webkit-transition: all 1.5s linear;
-moz-transition: all 1.5s linear;
-o-transition: all 1.5s linear;
-ms-transition: all 1.5s linear;
transition: all 1.5s linear;
transform: rotateY(-90deg);
-webkit-transform: rotateY(-90deg);
-moz-transform: rotateY(-90deg);
-ms-transform: rotateY(-90deg);
-o-transform: rotateY(-90deg);
}
.rear b a {
color: #CCCCCC;
text-decoration: none;
}
.rear:hover b {
transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);
-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
-o-transform: rotateY(0deg);
}
.category {
position: absolute;
text-transform: uppercase;
font-family: Impact;
font-size: 12px;
font-weight: 500;
color: #CCCCCC;
background: rgba(0, 0, 0, 0.55);
padding: 1px 5px;
animation: increase 1.5s linear;
-webkit-animation: increase 1.5s linear;
-moz-animation: increase 1.5s linear;
-o-animation: increase 1.5s linear;
-ms-animation: increase 1.5s linear;
}
@keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-webkit-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-moz-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-o-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
@-ms-keyframes increase {
0% {transform: scale(0);}
100% {transform: scale(1);}
}
.tooltip {
z-index: 5;    
position: relative;
cursor: pointer;
}
.tooltip em {
display: none;
}
.tooltip:hover em {
font-style: normal;
display: block;
position: absolute;
background: rgba(0, 0, 0, 0.65);
color: #CCCCCC;
padding: 3px 5px;
bottom: 22px;
right: 0;
width: 100px;
box-shadow: 0 0 5px #363636;
border-radius: 5px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-webkit-box-shadow: 0 0 5px #363636;
-moz-box-shadow: 0 0 5px #363636;
}
.tooltip:hover em i {
position: absolute;
bottom: -7px;
right: 5px;
border-top: 7px solid #000;
border-left: 7px solid transparent;
display: block;
}
@media all and (max-width: 640px) {
.internal {
width: 48%;  
margin: 1%;    
}     
</style>


Iznākums



-------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------

----------------------------------------------

Cits matereālu izskats kurš izmantots kā informeris.

Code

<a href="$ENTRY_URL$">
<div class="v_mat">
<div class="v_mat_img">
<img src="$IMG_URL1$" alt="$TITLE$">
<div class="v_mat_blur">
<span class="v_mat_blur_img" style="background-image: url('$IMG_URL1$')"></span>
<div class="v_mat_title"><h1>$TITLE$</h1>
<div class="v_mat_message">$MESSAGE$</div>
</div>
</div>
<div class="v_mat_info">
<div class="v_mat_left">$CATEGORY_NAME$</div>
<div class="v_mat_right"></div>
</div>
</div>
</div>
</a>

<style type="text/css">

.v_mat {box-shadow: 0 0 3px 1px rgba(0,119,255,.45); display: inline-block; float: left; width: calc(100% - 10px); height: 330px; margin: 5px; background: rgba(0,0,0,.15); border-radius: 3px; overflow: hidden;}
.v_mat:hover {box-shadow: 0 0 3px 3px rgba(0,119,255,.65);}
.v_mat_img {width: 100%; height: 330px;}
.v_mat_img img {width: 100%; height: 330px; object-fit: cover;}
.v_mat_blur {width: 100%; height: 50px; overflow: hidden; transform: translate(0,-53px); box-shadow: 0 -2px 0 0 rgba(0,119,255,.65);}
.v_mat_blur_img {display: block; width: calc(100% + 20px); height: 320px; transform: translate(0,-255px); background-position: center; background-size: cover; filter: blur(5px); -webkit-filter: blur(5px); margin: -10px;}
.v_mat_title {width: calc(110% - 30px); height: 50px; padding: 0 15px; transform: translate(0,-300px); color: rgba(0,0,0,.75); background-color: rgba(255,255,255,.25); overflow: hidden;}
.v_mat_title h1 {line-height: 42px; text-transform: uppercase; font-family: 'Roboto',sans-serif;font-size: 10px; font-weight: bold;}
.v_mat_info {width: 100%; height: 20px; display: table; transform: translate(0,-353px); opacity: .65; background: rgba(0,0,0,.45);}
.v_mat_left, .v_mat_right {width: calc(50% - 10px); padding: 0 5px; display: table-cell; vertical-align: middle; color: #fff; text-shadow: 1px 1px 0 rgba(0,0,0,.85); font-size: 12px; font-weight: bold;}
.v_mat_right {text-align: right;}
.v_mat_message {height: 0; width: calc(100% - 10px); padding: 0 5px; overflow: hidden; font-size: 12px; line-htight: 12px; font-weight: normal; background: rgba(255,255,255,.3)}

.v_mat:hover .v_mat_blur {height: 330px; transform: translate(0,-303px);}
.v_mat:hover .v_mat_blur_img {transform: translate(0,0);}
.v_mat:hover .v_mat_title {height: 280px}
.v_mat:hover .v_mat_message {height: 250px; transform: translate(0,0);}
.v_mat:hover .v_mat_info {background: rgba(0,0,0,.85); opacity: 1; transform: translate(0,-353px);}

.v_mat, .v_mat_info, .v_mat_blur, .v_mat_title, .v_mat_message {transition: all linear .2s;}

</style>


Orģināls, platāks ,1 vai 2 kolonām.

Code
<a href="$ENTRY_URL$">  
  <div class="v_mat">  
  <div class="v_mat_img">  
  <img src="$IMG_URL1$" alt="$TITLE$">  
  <div class="v_mat_blur">  
  <span class="v_mat_blur_img" style="background-image: url('$IMG_URL1$')"></span>  
  <div class="v_mat_title"><h1>$TITLE$</h1>  
  <div class="v_mat_message">$MESSAGE$</div>  
  </div>  
  </div>  
  <div class="v_mat_info">  
  <div class="v_mat_left">$CATEGORY_NAME$</div>  
  <div class="v_mat_right">$DATE$ - $TIME$</div>  
  </div>  
  </div>  
  </div>  
  </a>
<style type="text/css">

.v_mat {box-shadow: 0 0 3px 1px rgba(0,119,255,.45); display: inline-block; float: left; width: calc(50% - 10px); height: 300px; margin: 5px; background: rgba(0,0,0,.15); border-radius: 3px; overflow: hidden;}
.v_mat:hover {box-shadow: 0 0 3px 3px rgba(0,119,255,.65);}
.v_mat_img {width: 100%; height: 300px;}
.v_mat_img img {width: 100%; height: 300px; object-fit: cover;}
.v_mat_blur {width: 100%; height: 50px; overflow: hidden; transform: translate(0,-53px); box-shadow: 0 -2px 0 0 rgba(0,119,255,.65);}
.v_mat_blur_img {display: block; width: calc(100% + 20px); height: 320px; transform: translate(0,-255px); background-position: center; background-size: cover; filter: blur(5px); -webkit-filter: blur(5px); margin: -10px;}
.v_mat_title {width: calc(100% - 30px); height: 50px; padding: 0 15px; transform: translate(0,-300px); color: rgba(0,0,0,.75); background-color: rgba(255,255,255,.25); overflow: hidden;}
.v_mat_title h1 {line-height: 42px; text-transform: uppercase; font-family: 'Roboto',sans-serif;font-size: 17px; font-weight: bold;}
.v_mat_info {width: 100%; height: 20px; display: table; transform: translate(0,-353px); opacity: .65; background: rgba(0,0,0,.45);}
.v_mat_left, .v_mat_right {width: calc(50% - 10px); padding: 0 5px; display: table-cell; vertical-align: middle; color: #fff; text-shadow: 1px 1px 0 rgba(0,0,0,.85); font-size: 12px; font-weight: bold;}
.v_mat_right {text-align: right;}
.v_mat_message {height: 0; width: calc(100% - 10px); padding: 0 5px; overflow: hidden; font-size: 12px; line-htight: 12px; font-weight: normal; background: rgba(255,255,255,.3)}

.v_mat:hover .v_mat_blur {height: 330px; transform: translate(0,-303px);}
.v_mat:hover .v_mat_blur_img {transform: translate(0,0);}
.v_mat:hover .v_mat_title {height: 280px}
.v_mat:hover .v_mat_message {height: 200px; transform: translate(0,0);}
.v_mat:hover .v_mat_info {background: rgba(0,0,0,.85); opacity: 1; transform: translate(0,-353px);}

.v_mat, .v_mat_info, .v_mat_blur, .v_mat_title, .v_mat_message {transition: all linear .2s;}

</style>


Iznākums

Pielikumi: 0530841.png(544.0 Kb) · 4020285.png(428.1 Kb)



.
.


uWM // FORUMS » uWEBMEISTARS // WEBLAPU PLATFORMAS » WEBLAPU APLIKĀCIJAS, SKRIPTI, SPRAUDŅI » uCoz » Matereālu izskats kino jaunumiem, rakstiem un tamlīdzīgi
  • Lappuse 1 no 1
  • 1
Meklēšana:

UWM apmeklēja:

RESPEKTABLĀKIE PORTĀLA FORUMA KLAVIATŪRISTI :
Foruma viszinis
Korijs
UWM karma: 380
Foruma atkarīgais
wuxmachine
UWM karma: 157
Foruma atkarīgais
Robiits
UWM karma: 87
Foruma šamanis
0wn3r
UWM karma: 80
Foruma atkarīgais
H[o_0]LiGaN
UWM karma: 78
Foruma atkarīgais
Spanky
UWM karma: 76
Foruma viszinis
Ar4ssS
UWM karma: 74
Foruma atkarīgais
Profth3tic
UWM karma: 55
Foruma atkarīgais
emciits
UWM karma: 52
Foruma atkarīgais
JackDaniel
UWM karma: 51
Foruma atkarīgais
Antikrists
UWM karma: 51
Foruma atkarīgais
Ken_D
UWM karma: 50
Ielāde...