Блок с закругленными уголками

Блок с закругленными уголками

Блок с закругленными уголками

Главная Контакты Софт Термины Неисправности Поисковики Шаблоны

Блок с закругленными уголками
JavaScript

Можно вставлять текст,ссылки или фото

Просмотр скрипта

<style type="text/css">
b.niftycorners,b.niftyfill{display:block}
b.niftycorners *{display:block;height: 1px;line-height:1px;font-size: 1px;
    overflow:hidden;border-style:solid;border-width: 0 1px}
b.r1{margin: 0 3px;border-width: 0 2px}
b.r2{margin: 0 2px}
b.r3{margin: 0 1px}
b.r4{height: 2px}
b.rb1{margin: 0 8px;border-width:0 2px}
b.rb2{margin: 0 6px;border-width:0 2px}
b.rb3{margin: 0 5px}
b.rb4{margin: 0 4px}
b.rb5{margin: 0 3px}
b.rb6{margin: 0 2px}
b.rb7{margin: 0 1px;height:2px}
b.rb8{margin: 0;height:2px}
b.rs1{margin: 0 1px}
b.t1{border-width: 0 5px}
b.t2{border-width: 0 3px}
b.t3{border-width: 0 2px}
b.t4{height: 2px}
b.tb1{border-width: 0 10px}
b.tb2{border-width: 0 8px}
b.tb3{border-width: 0 6px}
b.tb4{border-width: 0 5px}
b.tb5{border-width: 0 4px}
b.tb6{border-width: 0 3px}
b.tb7{border-width: 0 2px;height:2px}
b.tb8{border-width: 0 1px;height:2px}
b.ts1{border-width: 0 2px}
body{background:#A1FEF9;color:#FFFFAA;text-align:center;font: 18px Verdana,Arial,sans-serif}
ul#about,ul#about li{list-style-type:none;margin:0;padding:0}
ul#about{width: 95%;margin:10px auto 0;text-align:left}
ul#about li{float:left;width: 30%; height:400px;
    padding: 30px 10px 20px 20px;margin:8px 8px 0 0}
li#ab1{background:#04860B}
</style>
<script type="text/javascript">
var niftyOk=(document.getElementById&&document.createElement&&Array.prototype.push);
var niftyCss=false;
String.prototype.find=function(_1){
return (this.indexOf(_1)>=0?true:false);
};
var oldonload=window.onload;
if(typeof (NiftyLoad)!="function"){
NiftyLoad=function(){
};
}
if(typeof (oldonload)=="function"){
window.onload=function(){
oldonload();
AddCss();
NiftyLoad();
};
}else{
window.onload=function(){
AddCss();
NiftyLoad();
};
}
function AddCss(){
niftyCss=true;
var l=CreateEl("link");
l.setAttribute("type","text/css");
l.setAttribute("rel","stylesheet");
l.setAttribute("href","niftyCorners.css");
l.setAttribute("media","screen");
document.getElementsByTagName("head")[0].appendChild(l);
};
function Nifty(_3,_4){
if(niftyOk==false){
return;
}
if(niftyCss==false){
AddCss();
}
var i,v=_3.split(","),h=0;
if(_4==null){
_4="";
}
if(_4.find("fixed-height")){
h=getElementsBySelector(v[0])[0].offsetHeight;
}
for(i=0;i<v.length;i++){
Rounded(v[i],_4);
}
if(_4.find("height")){
SameHeight(_3,h);
}
};
function Rounded(_8,_9){
var i,_b="",_c="",v=new Array();
if(_9!=""){
_9=_9.replace("left","tl bl");
_9=_9.replace("right","tr br");
_9=_9.replace("top","tr tl");
_9=_9.replace("bottom","br bl");
_9=_9.replace("transparent","alias");
if(_9.find("tl")){
_b="both";
if(!_9.find("tr")){
_b="left";
}
}else{
if(_9.find("tr")){
_b="right";
}
}
if(_9.find("bl")){
_c="both";
if(!_9.find("br")){
_c="left";
}
}else{
if(_9.find("br")){
_c="right";
}
}
}
if(_b==""&&_c==""&&!_9.find("none")){
_b="both";
_c="both";
}
v=getElementsBySelector(_8);
for(i=0;i<v.length;i++){
FixIE(v[i]);
if(_b!=""){
AddTop(v[i],_b,_9);
}
if(_c!=""){
AddBottom(v[i],_c,_9);
}
}
};
function AddTop(el,_f,_10){
var d=CreateEl("b"),lim=4,_13="",p,i,_16="r",bk,_18;
d.style.marginLeft="-"+getPadding(el,"Left")+"px";
d.style.marginRight="-"+getPadding(el,"Right")+"px";
if(_10.find("alias")||(_18=getBk(el))=="transparent"){
_18="transparent";
bk="transparent";
_13=getParentBk(el);
_16="t";
}else{
bk=getParentBk(el);
_13=Mix(_18,bk);
}
d.style.background=bk;
d.className="niftycorners";
p=getPadding(el,"Top");
if(_10.find("small")){
d.style.marginBottom=(p-2)+"px";
_16+="s";
lim=2;
}else{
if(_10.find("big")){
d.style.marginBottom=(p-10)+"px";
_16+="b";
lim=8;
}else{
d.style.marginBottom=(p-5)+"px";
}
}
for(i=1;i<=lim;i++){
d.appendChild(CreateStrip(i,_f,_18,_13,_16));
}
el.style.paddingTop="0";
el.insertBefore(d,el.firstChild);
};
function AddBottom(el,_1a,_1b){
var d=CreateEl("b"),lim=4,_1e="",p,i,_21="r",bk,_23;
d.style.marginLeft="-"+getPadding(el,"Left")+"px";
d.style.marginRight="-"+getPadding(el,"Right")+"px";
if(_1b.find("alias")||(_23=getBk(el))=="transparent"){
_23="transparent";
bk="transparent";
_1e=getParentBk(el);
_21="t";
}else{
bk=getParentBk(el);
_1e=Mix(_23,bk);
}
d.style.background=bk;
d.className="niftycorners";
p=getPadding(el,"Bottom");
if(_1b.find("small")){
d.style.marginTop=(p-2)+"px";
_21+="s";
lim=2;
}else{
if(_1b.find("big")){
d.style.marginTop=(p-10)+"px";
_21+="b";
lim=8;
}else{
d.style.marginTop=(p-5)+"px";
}
}
for(i=lim;i>0;i--){
d.appendChild(CreateStrip(i,_1a,_23,_1e,_21));
}
el.style.paddingBottom=0;
el.appendChild(d);
};
function CreateStrip(_24,_25,_26,_27,_28){
var x=CreateEl("b");
x.className=_28+_24;
x.style.backgroundColor=_26;
x.style.borderColor=_27;
if(_25=="left"){
x.style.borderRightWidth="0";
x.style.marginRight="0";
}else{
if(_25=="right"){
x.style.borderLeftWidth="0";
x.style.marginLeft="0";
}
}
return (x);
};
function CreateEl(x){
return (document.createElement(x));
};
function FixIE(el){
if(el.currentStyle!=null&&el.currentStyle.hasLayout!=null&&el.currentStyle.hasLayout==false){
el.style.display="inline-block";
}
};
function SameHeight(_2c,_2d){
var i,v=_2c.split(","),t,j,els=[],gap;
for(i=0;i<v.length;i++){
t=getElementsBySelector(v[i]);
els=els.concat(t);
}
for(i=0;i<els.length;i++){
if(els[i].offsetHeight>_2d){
_2d=els[i].offsetHeight;
}
els[i].style.height="auto";
}
for(i=0;i<els.length;i++){
gap=_2d-els[i].offsetHeight;
if(gap>0){
t=CreateEl("b");
t.className="niftyfill";
t.style.height=gap+"px";
nc=els[i].lastChild;
if(nc.className=="niftycorners"){
els[i].insertBefore(t,nc);
}else{
els[i].appendChild(t);
}
}
}
};
function getElementsBySelector(_34){
var i,j,_37="",_38="",tag=_34,_3a="",v2,k,f,a,s=[],_40=[],c;
if(_34.find("#")){
if(_34.find(" ")){
s=_34.split(" ");
var fs=s[0].split("#");
if(fs.length==1){
return (_40);
}
f=document.getElementById(fs[1]);
if(f){
v=f.getElementsByTagName(s[1]);
for(i=0;i<v.length;i++){
_40.push(v[i]);
}
}
return (_40);
}else{
s=_34.split("#");
tag=s[0];
_37=s[1];
if(_37!=""){
f=document.getElementById(_37);
if(f){
_40.push(f);
}
return (_40);
}
}
}
if(_34.find(".")){
s=_34.split(".");
tag=s[0];
_38=s[1];
if(_38.find(" ")){
s=_38.split(" ");
_38=s[0];
_3a=s[1];
}
}
var v=document.getElementsByTagName(tag);
if(_38==""){
for(i=0;i<v.length;i++){
_40.push(v[i]);
}
return (_40);
}
for(i=0;i<v.length;i++){
c=v[i].className.split(" ");
for(j=0;j<c.length;j++){
if(c[j]==_38){
if(_3a==""){
_40.push(v[i]);
}else{
v2=v[i].getElementsByTagName(_3a);
for(k=0;k<v2.length;k++){
_40.push(v2[k]);
}
}
}
}
}
return (_40);
};
function getParentBk(x){
var el=x.parentNode,c;
while(el.tagName.toUpperCase()!="HTML"&&(c=getBk(el))=="transparent"){
el=el.parentNode;
}
if(c=="transparent"){
c="#FFFFFF";
}
return (c);
};
function getBk(x){
var c=getStyleProp(x,"backgroundColor");
if(c==null||c=="transparent"||c.find("rgba(0, 0, 0, 0)")){
return ("transparent");
}
if(c.find("rgb")){
c=rgb2hex(c);
}
return (c);
};
function getPadding(x,_4a){
var p=getStyleProp(x,"padding"+_4a);
if(p==null||!p.find("px")){
return (0);
}
return (parseInt(p));
};
function getStyleProp(x,_4d){
if(x.currentStyle){
return (x.currentStyle[_4d]);
}
if(document.defaultView.getComputedStyle){
return (document.defaultView.getComputedStyle(x,"")[_4d]);
}
return (null);
};
function rgb2hex(_4e){
var hex="",v,h,i;
var _53=/([0-9]+)[, ]+([0-9]+)[, ]+([0-9]+)/;
var h=_53.exec(_4e);
for(i=1;i<4;i++){
v=parseInt(h[i]).toString(16);
if(v.length==1){
hex+="0"+v;
}else{
hex+=v;
}
}
return ("#"+hex);
};
function Mix(c1,c2){
var i,_57,_58,x,y,r=new Array(3);
if(c1.length==4){
_57=1;
}else{
_57=2;
}
if(c2.length==4){
_58=1;
}else{
_58=2;
}
for(i=0;i<3;i++){
x=parseInt(c1.substr(1+_57*i,_57),16);
if(_57==1){
x=16*x+x;
}
y=parseInt(c2.substr(1+_58*i,_58),16);
if(_58==1){
y=16*y+y;
}
r[i]=Math.floor((x*50+y*50)/100);
r[i]=r[i].toString(16);
if(r[i].length==1){
r[i]="0"+r[i];
}
}
return ("#"+r[0]+r[1]+r[2]);
};
</script>
<script type="text/javascript">
window.onload=function(){
Nifty("div#about li","big fixed-height");
}
</script>
</head>
<body><font color="#B51D02" size="5">Блок с закругленными уголками</font><br>
<font color="#B51D02" size="3">Просмотр скрипта<br> </font>
  <style type="text/css">
b.niftycorners,b.niftyfill{display:block}
b.niftycorners *{display:block;height: 1px;line-height:1px;font-size: 1px;
    overflow:hidden;border-style:solid;border-width: 0 1px}
b.r1{margin: 0 3px;border-width: 0 2px}
b.r2{margin: 0 2px}
b.r3{margin: 0 1px}
b.r4{height: 2px}
b.rb1{margin: 0 8px;border-width:0 2px}
b.rb2{margin: 0 6px;border-width:0 2px}
b.rb3{margin: 0 5px}
b.rb4{margin: 0 4px}
b.rb5{margin: 0 3px}
b.rb6{margin: 0 2px}
b.rb7{margin: 0 1px;height:2px}
b.rb8{margin: 0;height:2px}
b.rs1{margin: 0 1px}
b.t1{border-width: 0 5px}
b.t2{border-width: 0 3px}
b.t3{border-width: 0 2px}
b.t4{height: 2px}
b.tb1{border-width: 0 10px}
b.tb2{border-width: 0 8px}
b.tb3{border-width: 0 6px}
b.tb4{border-width: 0 5px}
b.tb5{border-width: 0 4px}
b.tb6{border-width: 0 3px}
b.tb7{border-width: 0 2px;height:2px}
b.tb8{border-width: 0 1px;height:2px}
b.ts1{border-width: 0 2px}
body{background:#A1FEF9;color:#FFFFAA;text-align:center;font: 18px Verdana,Arial,sans-serif}
ul#about,ul#about li{list-style-type:none;margin:0;padding:0}
ul#about{width: 95%;margin:10px auto 0;text-align:left}
ul#about li{float:left;width: 30%; height:400px;
    padding: 30px 10px 20px 20px;margin:8px 8px 0 0}
li#ab1{background:#04860B}
</style>
<script type="text/javascript">
var niftyOk=(document.getElementById&&document.createElement&&Array.prototype.push);
var niftyCss=false;
String.prototype.find=function(_1){
return (this.indexOf(_1)>=0?true:false);
};
var oldonload=window.onload;
if(typeof (NiftyLoad)!="function"){
NiftyLoad=function(){
};
}
if(typeof (oldonload)=="function"){
window.onload=function(){
oldonload();
AddCss();
NiftyLoad();
};
}else{
window.onload=function(){
AddCss();
NiftyLoad();
};
}
function AddCss(){
niftyCss=true;
var l=CreateEl("link");
l.setAttribute("type","text/css");
l.setAttribute("rel","stylesheet");
l.setAttribute("href","niftyCorners.css");
l.setAttribute("media","screen");
document.getElementsByTagName("head")[0].appendChild(l);
};
function Nifty(_3,_4){
if(niftyOk==false){
return;
}
if(niftyCss==false){
AddCss();
}
var i,v=_3.split(","),h=0;
if(_4==null){
_4="";
}
if(_4.find("fixed-height")){
h=getElementsBySelector(v[0])[0].offsetHeight;
}
for(i=0;i<v.length;i++){
Rounded(v[i],_4);
}
if(_4.find("height")){
SameHeight(_3,h);
}
};
function Rounded(_8,_9){
var i,_b="",_c="",v=new Array();
if(_9!=""){
_9=_9.replace("left","tl bl");
_9=_9.replace("right","tr br");
_9=_9.replace("top","tr tl");
_9=_9.replace("bottom","br bl");
_9=_9.replace("transparent","alias");
if(_9.find("tl")){
_b="both";
if(!_9.find("tr")){
_b="left";
}
}else{
if(_9.find("tr")){
_b="right";
}
}
if(_9.find("bl")){
_c="both";
if(!_9.find("br")){
_c="left";
}
}else{
if(_9.find("br")){
_c="right";
}
}
}
if(_b==""&&_c==""&&!_9.find("none")){
_b="both";
_c="both";
}
v=getElementsBySelector(_8);
for(i=0;i<v.length;i++){
FixIE(v[i]);
if(_b!=""){
AddTop(v[i],_b,_9);
}
if(_c!=""){
AddBottom(v[i],_c,_9);
}
}
};
function AddTop(el,_f,_10){
var d=CreateEl("b"),lim=4,_13="",p,i,_16="r",bk,_18;
d.style.marginLeft="-"+getPadding(el,"Left")+"px";
d.style.marginRight="-"+getPadding(el,"Right")+"px";
if(_10.find("alias")||(_18=getBk(el))=="transparent"){
_18="transparent";
bk="transparent";
_13=getParentBk(el);
_16="t";
}else{
bk=getParentBk(el);
_13=Mix(_18,bk);
}
d.style.background=bk;
d.className="niftycorners";
p=getPadding(el,"Top");
if(_10.find("small")){
d.style.marginBottom=(p-2)+"px";
_16+="s";
lim=2;
}else{
if(_10.find("big")){
d.style.marginBottom=(p-10)+"px";
_16+="b";
lim=8;
}else{
d.style.marginBottom=(p-5)+"px";
}
}
for(i=1;i<=lim;i++){
d.appendChild(CreateStrip(i,_f,_18,_13,_16));
}
el.style.paddingTop="0";
el.insertBefore(d,el.firstChild);
};
function AddBottom(el,_1a,_1b){
var d=CreateEl("b"),lim=4,_1e="",p,i,_21="r",bk,_23;
d.style.marginLeft="-"+getPadding(el,"Left")+"px";
d.style.marginRight="-"+getPadding(el,"Right")+"px";
if(_1b.find("alias")||(_23=getBk(el))=="transparent"){
_23="transparent";
bk="transparent";
_1e=getParentBk(el);
_21="t";
}else{
bk=getParentBk(el);
_1e=Mix(_23,bk);
}
d.style.background=bk;
d.className="niftycorners";
p=getPadding(el,"Bottom");
if(_1b.find("small")){
d.style.marginTop=(p-2)+"px";
_21+="s";
lim=2;
}else{
if(_1b.find("big")){
d.style.marginTop=(p-10)+"px";
_21+="b";
lim=8;
}else{
d.style.marginTop=(p-5)+"px";
}
}
for(i=lim;i>0;i--){
d.appendChild(CreateStrip(i,_1a,_23,_1e,_21));
}
el.style.paddingBottom=0;
el.appendChild(d);
};
function CreateStrip(_24,_25,_26,_27,_28){
var x=CreateEl("b");
x.className=_28+_24;
x.style.backgroundColor=_26;
x.style.borderColor=_27;
if(_25=="left"){
x.style.borderRightWidth="0";
x.style.marginRight="0";
}else{
if(_25=="right"){
x.style.borderLeftWidth="0";
x.style.marginLeft="0";
}
}
return (x);
};
function CreateEl(x){
return (document.createElement(x));
};
function FixIE(el){
if(el.currentStyle!=null&&el.currentStyle.hasLayout!=null&&el.currentStyle.hasLayout==false){
el.style.display="inline-block";
}
};
function SameHeight(_2c,_2d){
var i,v=_2c.split(","),t,j,els=[],gap;
for(i=0;i<v.length;i++){
t=getElementsBySelector(v[i]);
els=els.concat(t);
}
for(i=0;i<els.length;i++){
if(els[i].offsetHeight>_2d){
_2d=els[i].offsetHeight;
}
els[i].style.height="auto";
}
for(i=0;i<els.length;i++){
gap=_2d-els[i].offsetHeight;
if(gap>0){
t=CreateEl("b");
t.className="niftyfill";
t.style.height=gap+"px";
nc=els[i].lastChild;
if(nc.className=="niftycorners"){
els[i].insertBefore(t,nc);
}else{
els[i].appendChild(t);
}
}
}
};
function getElementsBySelector(_34){
var i,j,_37="",_38="",tag=_34,_3a="",v2,k,f,a,s=[],_40=[],c;
if(_34.find("#")){
if(_34.find(" ")){
s=_34.split(" ");
var fs=s[0].split("#");
if(fs.length==1){
return (_40);
}
f=document.getElementById(fs[1]);
if(f){
v=f.getElementsByTagName(s[1]);
for(i=0;i<v.length;i++){
_40.push(v[i]);
}
}
return (_40);
}else{
s=_34.split("#");
tag=s[0];
_37=s[1];
if(_37!=""){
f=document.getElementById(_37);
if(f){
_40.push(f);
}
return (_40);
}
}
}
if(_34.find(".")){
s=_34.split(".");
tag=s[0];
_38=s[1];
if(_38.find(" ")){
s=_38.split(" ");
_38=s[0];
_3a=s[1];
}
}
var v=document.getElementsByTagName(tag);
if(_38==""){
for(i=0;i<v.length;i++){
_40.push(v[i]);
}
return (_40);
}
for(i=0;i<v.length;i++){
c=v[i].className.split(" ");
for(j=0;j<c.length;j++){
if(c[j]==_38){
if(_3a==""){
_40.push(v[i]);
}else{
v2=v[i].getElementsByTagName(_3a);
for(k=0;k<v2.length;k++){
_40.push(v2[k]);
}
}
}
}
}
return (_40);
};
function getParentBk(x){
var el=x.parentNode,c;
while(el.tagName.toUpperCase()!="HTML"&&(c=getBk(el))=="transparent"){
el=el.parentNode;
}
if(c=="transparent"){
c="#FFFFFF";
}
return (c);
};
function getBk(x){
var c=getStyleProp(x,"backgroundColor");
if(c==null||c=="transparent"||c.find("rgba(0, 0, 0, 0)")){
return ("transparent");
}
if(c.find("rgb")){
c=rgb2hex(c);
}
return (c);
};
function getPadding(x,_4a){
var p=getStyleProp(x,"padding"+_4a);
if(p==null||!p.find("px")){
return (0);
}
return (parseInt(p));
};
function getStyleProp(x,_4d){
if(x.currentStyle){
return (x.currentStyle[_4d]);
}
if(document.defaultView.getComputedStyle){
return (document.defaultView.getComputedStyle(x,"")[_4d]);
}
return (null);
};
function rgb2hex(_4e){
var hex="",v,h,i;
var _53=/([0-9]+)[, ]+([0-9]+)[, ]+([0-9]+)/;
var h=_53.exec(_4e);
for(i=1;i<4;i++){
v=parseInt(h[i]).toString(16);
if(v.length==1){
hex+="0"+v;
}else{
hex+=v;
}
}
return ("#"+hex);
};
function Mix(c1,c2){
var i,_57,_58,x,y,r=new Array(3);
if(c1.length==4){
_57=1;
}else{
_57=2;
}
if(c2.length==4){
_58=1;
}else{
_58=2;
}
for(i=0;i<3;i++){
x=parseInt(c1.substr(1+_57*i,_57),16);
if(_57==1){
x=16*x+x;
}
y=parseInt(c2.substr(1+_58*i,_58),16);
if(_58==1){
y=16*y+y;
}
r[i]=Math.floor((x*50+y*50)/100);
r[i]=r[i].toString(16);
if(r[i].length==1){
r[i]="0"+r[i];
}
}
return ("#"+r[0]+r[1]+r[2]);
};
</script>
<script type="text/javascript">
window.onload=function(){
Nifty("div#about li","big fixed-height");
}
</script>
</head>
 <ul id="about">
    <li id="ab1">Блок с закругленными уголками<br>JavaScript<br><br>Можно вставлять текст,ссылки или фото<br><br><a href="../index.html" title="Главная"><img src="s2.jpg" width=148 height=233 border=0></a></li>
</ul>
</div>
</body>
</html>

Пример создания сайта
Размещение сайта в Интернете
Раскрутка сайта в Интернете
Заработок в Интернете
Visual Basic 6.0 с примерами
VBScript
Руководство по C++
JavaScript
Анимация в формате GIF
Вставка видео SWF в сайт.
Пиктограмма сайта (favicon)

Оригинальные меню

Анимированный текст

Календари и часы

Эффектная графика

Дополнительные окна

Таблицы

Таблица с закругленными уголками

Калькуляторы

Операции с цветом

Кнопки

Разное