|
Butonul Descarca
|
|
Muşatinu  | Date: Duminică, 2011-05-01, 14:07 | Message # 1 |
| De cateva zile incerc sa fac Soft Util pentru WebMasteri. Cautand descrierea la un soft, am dat de un Buton de descarcare foarte fain....  Unde dorim sa apara butonul punem: Code <a href="$FILE_URL$" class="sfdl2">
<span>
Descarcă<br/>
<small>$FILE_SIZE$</small>
</span>
</a> Si in CSS punem stilurile:
Code .sfdl2 { width:165px;height:38px;padding:0;position:relative;font:bold 12px !important; border:1px solid #aaa;display:inline;float:left;text-decoration:none;-moz-box-shadow:rgba(255, 255, 255, 0.6) 0 1px 0 0;-webkit-box-shadow:rgba(255, 255, 255, 0.6) 0 1px 0 0;-o-box-shadow:rgba(255, 255, 255, 0.6) 0 1px 0 0;box-shadow:rgba(255, 255, 255, 0.6) 0 1px 0 0;-moz-border-radius:4px;-webkit-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;-khtml-border-radius:4px;border-radius:4px;background:#e5e5e5;background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #fff), color-stop(100%, #ccc));background-image:-moz-linear-gradient(top, #fff 0%, #ccc 100%);background-image:linear-gradient(top, #fff 0%, #ccc 100%);text-shadow:#fff 0 1px;margin:0 10px 7px 0;overflow:hidden;color:#555 !important;}
.sfdl2:hover { cursor:pointer !important;text-decoration:none;background:#eee !important;background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #fff), color-stop(100%, #eee));background-image:-moz-linear-gradient(top, #fff 0%, #eee 100%);background-image:linear-gradient(top, #fff 0%, #eee 100%);}
.sfdl2 span { border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;height:29px;line-height:13px;margin:3px;padding:4px 0 0 4px;text-align:left;text-shadow:none;width:123px;float:right;margin-left:20px;color:#FFF;background:#363;background-image:-moz-linear-gradient(center top, #393 0%, #373 100%);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #393),color-stop(1, #373));}
.sfdl2 small { background:no-repeat url(http://maxrom.ucoz.com/Instrumente/softutil/fiveicon.gif);color:#ADC2AD; font-weight:normal;height:34px;left:9px;padding:9px 0 0 30px;position:absolute;top:12px;width:120px;white-space:nowrap;overflow:hidden;font-size:90%;}
Daca ati intalnit un asa buton interesant anuntate-ne aici. 
|
| |
|
|
| Muşatinu | Date: Luni, 2011-05-02, 08:48 | Message # 2 |
|
| Alt Buton:
 Unde avem nevoie daugam codul:
Code <a href="$FILE_URL$" class="download-link" title="Descarcă $ENTRY_TITLE$">
<span>
<strong>Descarcă $VERSION$</strong>
<em>for $OS$
$INTERFACE_LNG$
size $FILE_SIZE$</em>
</span></a>
iar in CSS adaugam stilurile: Code
a.download-link{display:block;padding:5px 0 0 0;margin-bottom:0.1em;text-decoration:none;color:#eeeeee;width:249px;background:url(http://portableapps.com/sites/all/themes/portableappsnew/images/download-portableapps.png) 0 0 no-repeat;text-align:left;line-height:145%;}
a.download-link span{display:block;min-height:37px;padding:10px;}* html a.download-link span{height:37px;}
a.download-link span{background:url(http://portableapps.com/sites/all/themes/portableappsnew/images/download-portableapps.png) 0 100% no-repeat;}
a.download-link strong{font-size:1.6em;text-decoration:none;font-weight:bold;color:#eeeeee;}
a.download-link em{font-style:normal;font-weight:normal;color:#eeeeee;letter-spacing:0;display:block;padding-top:3px;font-size:1em;}
a.download-link:hover,a.download-link:hover span,a.download-link:hover strong{color:white;cursor:pointer;background-position:100% 0;}
a.download-link:hover span{background-position:100% 100%;}
|
| |
|
|
| Devil | Date: Vineri, 2011-05-06, 14:34 | Message # 3 |
| Alt buton : Unde vreti sa apara puneti codu: Code <?if($FILE_URL$)?> <style>a.download:link, a.download:visited, a.download:active, .download:link, .download:visited, .download:active {text-decoration:none; font-family:arial; color:#fff; background:url('http://ucozua.ru/Scripts/9/111111.png') no-repeat top right; height:75px; width:325px; display:block;} a.download:hover, .download:hover, {text-decoration:none; font-family:arial; color:#fff; background:url('http://ucozua.ru/Scripts/9/111111.png') no-repeat top right; height:75px; width:325px; display:block;}</style> <a class="download" href="$FILE_URL$"><br><br><div style="font-size: 11px; font-family: tahoma; padding-top:5px; padding-left:250px;">$FILE_SIZE$ mb</div></a> <?endif?> 
|
| |
|
|
| Muşatinu | Date: Duminică, 2011-05-22, 09:44 | Message # 4 |
|
| 
Între si
adaugati:
Cod <?if($USER_AGENT$='opera')?>
<link type="text/css" rel="StyleSheet" href="http://maxrom.ucoz.com/css/1/btndesc/fixed_opera.css" />
<?else?>
<link type="text/css" rel="StyleSheet" href="http://maxrom.ucoz.com/css/1/btndesc/btn.css" />
<?endif?>
unde doriti sa apara bbutonul adaugati:
Cod <div class="download-btn" style="margin:15px;"> <a href="<?if($FILE_URL$)?>$FILE_URL$<?else?>$RFILE_URL$<?endif?>" class="download-btn" title="Descarca $ENTRY_TITLE$"> <span class="title">Descarca fisieru</span><br> <span class="size">Marime: <?if($FILE_SIZE$)?>$FILE_SIZE$<?else?>$RFILE_SIZE$<?endif?></span> </a> </div>
|
| |
|
|
| Muşatinu | Date: Duminică, 2013-05-26, 08:04 | Message # 5 |
|
| 
In CSS adaugam:
Cod /* Adaptations by coffee aka mozila aka ololowka */
.mknop {
display: inline-block;
margin: 10px 0px;
height: 30px;
border: 1px solid #419DB8;
border-radius: 5px;
box-shadow: inset 0px 1px 0px #7ACBE3, 0px 1px 0px 0px #fff, 0px 2px 4px 0px #90C9D8;
background: #58bedc;
background: -moz-linear-gradient(top, #58bedc 11%, #3097b5 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(11%,#58bedc), color-stop(100%,#3097b5));
background: -webkit-linear-gradient(top, #58bedc 11%,#3097b5 100%);
background: -o-linear-gradient(top, #58bedc 11%,#3097b5 100%);
background: -ms-linear-gradient(top, #58bedc 11%,#3097b5 100%);
background: linear-gradient(to bottom, #58bedc 11%,#3097b5 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58bedc', endColorstr='#3097b5',GradientType=0 );
}
.mknop:hover {
display: inline-block;
margin: 10px 0px;
height: 30px;
border: 1px solid #419DB8;
border-radius: 5px;
box-shadow: inset 0px 1px 0px #7ACBE3, 0px 1px 0px 0px #fff, 0px 2px 4px 0px #2186A2;
background: #58bedc;
background: -moz-linear-gradient(top, #58bedc 11%, #21819D 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(11%,#58bedc), color-stop(100%,#21819D));
background: -webkit-linear-gradient(top, #58bedc 11%,#21819D 100%);
background: -o-linear-gradient(top, #58bedc 11%,#21819D 100%);
background: -ms-linear-gradient(top, #58bedc 11%,#21819D 100%);
background: linear-gradient(to bottom, #58bedc 11%,#21819D 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58bedc', endColorstr='#21819D',GradientType=0 );
}
.mknoplink {
padding: 2px 8px;
display: inline-block;
background: #efefef;
background: -moz-linear-gradient(top, #efefef 0%, #dbdbdb 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), color-stop(100%,#dbdbdb));
background: -webkit-linear-gradient(top, #efefef 0%,#dbdbdb 100%);
background: -o-linear-gradient(top, #efefef 0%,#dbdbdb 100%);
background: -ms-linear-gradient(top, #efefef 0%,#dbdbdb 100%);
background: linear-gradient(to bottom, #efefef 0%,#dbdbdb 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#dbdbdb',GradientType=0 );
box-shadow: inset 0px 1px 0px #fff,0px 1px 0px #E5E5E5;
border-radius: 3px;
text-shadow: 0px 1px 0px #fff;
margin: 4px 10px 0px 5px;
color: #15586A;
font: 14px Arial;
}
.mknopsize {
margin: 0px 10px 0px 7px;
display: inline-block;
padding: 2px 5px;
background: #1A6479;
box-shadow: inset 0px 1px 2px #0A4352, 0px 1px 0px #48C1E3;
border-radius: 3px;
color: #C9F5FF;
text-shadow: 0px -1px 0px #0D3E4B;
}
.mknopdownload {
display: inline-block;
color: #D6F7FF;
text-shadow: 0px -1px 0px #1A6479;
}
.mknopcifr {
margin: 0px 5px 0px 5px;
display: inline-block;
padding: 2px 5px;
background: #1A6479;
box-shadow: inset 0px 1px 2px #0A4352, 0px 1px 0px #48C1E3;
border-radius: 3px;
color: #C9F5FF;
text-shadow: 0px -1px 0px #0D3E4B;
}
.mknorazt {
display: inline-block;
color: #D6F7FF;
text-shadow: 0px -1px 0px #1A6479;
}
/* ------ */
In aspectul materialului si comentariile la el din file manager adaugam unde dorim sa apara butonu:
Cod <?if($FILE_URL$)?><a href="$FILE_URL$"><div class="mknop"><div class="mknoplink">Descarca</div><?if($FILE_SIZE$)?><div class="mknorazt">Size:</div><div class="mknopsize">$FILE_SIZE$</div><?endif?><div class="mknopdownload">Descarcari: <div class="mknopcifr">$LOADS$</div></div></div></a><?endif?> <?if($RFILE_URL$)?><a href="$RFILE_URL$"><div class="mknop"><div class="mknoplink">Descarca</div><?if($FILE_SIZE$)?><div class="mknorazt">Size:</div><div class="mknopsize">$FILE_SIZE$</div><?endif?><div class="mknopdownload">Descarcari: <div class="mknopcifr">$LOADS$</div></div></div></a><?endif?>
[texterror4]Sursa: Necunoscut
Adaptare uCoz: webo4ka.ru
[/texterror4]
|
| |
|
|
| blak_angel | Date: Duminică, 2013-05-26, 09:16 | Message # 6 |
| Primul imi place tare 
Design-only
|
| |
|
|
© Copyright MyCorp © 2024
