کد افکت گذاري بر روي عکس هاي وبلاگ و سايت

کد کج شدن ، سايده دار شدن و ... عکس

نحوه استفاده :

در صورتي که انجام مراجا ذيل را براي خود مشکل مي بينديد ؛ کد را در قسمت تنظيمات ، بخش کد هاي اضاقي يا اسکريپ ها وبلاگ خود کپي کنيد .

1- به قسمت ويرايش قالب خود برويد و کد < head > يا < head /> را پيدا کنيد

2- کد مورد نظر را بين اين دو کپي کنيد

1.بزرگ شدن بصورت مستطيل


<style>
img{

-webkit-transform:scale(0.9); /*Webkit: Scale down image to 0.8x original size*/

-moz-transform:scale(0.9); /*Mozilla scale version*/

-o-transform:scale(0.9); /*Opera scale version*/

-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/

-moz-transition-duration: 0.5s; /*Mozilla duration version*/

-o-transition-duration: 0.5s; /*Opera duration version*/

opacity: 0.7; /*initial opacity of images*/

margin: 0 10px 9px 0; /*margin between images*/

}

img:hover{

-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/

-moz-transform:scale(1.1); /*Mozilla scale version*/

-o-transform:scale(1.1); /*Opera scale version*/

box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/

-webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/

-moz-box-shadow:0px 0px 80px gray; /*Mozilla shadow version*/

opacity: 1;

-webkit-transform: rotate(-10deg);

}
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

2.بزرگ شدن با لبه هاي گرد

<style>
img:hover{border-radius: 50px;
opacity:0.8;filter:alpha(opacity=80);
-webkit-transform:scale(1.1):( Webkit: Scale up image to 1.2x original size);
-moz-border-radius:6px;-webkit-border-radius:30px;
box-shadow: 10px 10px 5px #000;
-moz-transform:scale(1.1):( Mozilla scale version);
-moz-transform:scale(0.9):(Explorer scale version);

}
img:out{border-radius: 40px;
opacity:1;filter:alpha(opacity=100);
-webkit-transform:scale(0.9):( Webkit: Scale down image to 0.8x original size);
padding:0px; float:center;
-moz-transform:scale(0.9):(Mozilla scale version);
-moz-transform:scale(0.9):(Explorer scale version);

}

img{
-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}

img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/
box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
-webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
-moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
opacity: 1;

} 
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

3.شكل برگ شدن ثابت


<style>
img {
border: datted 5px #000;
border-radius: 80px 7px 80px 7px;
box-shadow: 0 0 1px #333;
-webkit-transition: all 1s ease-in;
-moz-transition: all 1s ease-in;
-o-transition: all 1s ease-in;
transition: all 1s ease-in;
-webkit-transform: rotate(1deg);
-moz-transform: rotate(1deg);
-o-transform: rotate(1deg);
} 
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

4.كج شدن آهسته تصوير با سايه


<style>
img { border-radius: 4px;
border: 1px solid #fff;
max-width: 480px;
margin: 2px;
padding:0px; float:center;
filter:alpha(opacity=100);
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-webkit-transition:all 0.4s ease-in;
-moz-transition:all 0.4s ease-in;
-o-transition:all 0.4s ease-in;
transition:all 0.4s ease-in;
opacity:1.0;
}
img:hover{ border-radius: 7px;
border: 1px solid #000;
max-width: 480px;
margin: 2px;
padding:0px; float:center;
filter:alpha(opacity=40);
opacity:0.4;
-moz-border-radius:6px;-webkit-border-radius:6px;
box-shadow: 10px 10px 5px #000;
-webkit-transition:all 0.4s ease-in;
-moz-transition:all 0.4s ease-in;
-o-transition:all 0.4s ease-in;
transition:all 0.4s ease-in;
}
img:hover{
opacity:1;filter:alpha(opacity=100);
-webkit-transform: rotate(-4deg);
-moz-transform: rotate(-4deg);

}
img:out{
opacity:1;filter:alpha(opacity=100);
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);

}

</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

5.كج شدن و چرخشي


<style>
img{
-webkit-transform:scale(0.9); /*design by : mosbat*/
-moz-transform:scale(0.9); /*design by : mosbat*/
-o-transform:scale(0.9); /*design by : mosbat*/
-webkit-transition-duration: 0.5s; /*design by : mosbat*/
-moz-transition-duration: 0.5s; /*design by : mosbat*/
-o-transition-duration: 0.5s; /*mosbataye-bahejab.LOXBLOG.COM*/
opacity: 0.9; /*mosbataye-bahejab.LOXBLOG.COM*/
margin: 0 10px 9px 0; /*mosbataye-bahejab.LOXBLOG.COM*/} 
img:hover{
-webkit-transform:scale(1.1); /*design by : mosbat*/ 
-moz-transform:scale(1.1); /*design by : mosbat*/ 
-o-transform:scale(1.1); /*design by : mosbat*/ 
box-shadow:0px 0px 0px gray; /*design by : mosbat*/ 
-webkit-box-shadow:0px 0px 0px gray; /*mosbataye-bahejab.LOXBLOG.COM*/ 
-moz-box-shadow:0px 0px 0px gray; /*mosbataye-bahejab.LOXBLOG.COM*/ 
opacity: 1.0;
 -webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
-o-transform: rotate(-10deg);}
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

6.فقط گرد و سايه دار شدن گوشه عكس

<style>
img:hover{border-radius: 50px;
opacity:0.8;filter:alpha(opacity=80);
-webkit-transform:scale(1.1):( Webkit: Scale up image to 1.2x original size);
-moz-border-radius:6px;-webkit-border-radius:30px;
box-shadow: 10px 10px 5px #000;	
-moz-transform:scale(1.1):( Mozilla scale version); 
-moz-transform:scale(0.9):(Explorer scale version);

}
img:out{border-radius: 40px;
opacity:1;filter:alpha(opacity=100);
-webkit-transform:scale(0.9):( Webkit: Scale down image to 0.8x original size);
padding:0px; float:center;
-moz-transform:scale(0.9):(Mozilla scale version);
-moz-transform:scale(0.9):(Explorer scale version);

}
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

7.چرخش كامل عكس


<style>
img:hover {
border: dashed underline 1px #333;
border-radius: 80px 6px 80px 6px;
box-shadow: 5 5 1px #333;
-webkit-transition: all 2s ease-in;
-moz-transition: all 2s ease-in;
-o-transition: all 2s ease-in;
transition: all 2s ease-in;
-webkit-transform: rotate(-360deg);
-moz-transform: rotate(-360deg);
-o-transform: rotate(-360deg);
}

img{border-radius: 40px;
opacity:1;filter:alpha(opacity=100);
-webkit-transform:scale(0.9):( Webkit: Scale down image to 0.8x original size);
padding:0px; float:center;
-moz-transform:scale(0.9):(Mozilla scale version);
-moz-transform:scale(0.9):(Explorer scale version);

}
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

8.از حالت عادي تبديل به برگ شدن با رفتن موس


<style>
img:hover{
border: datted 6px #000;
border-radius: 80px 7px 80px 7px;
box-shadow: 0 0 1px #333;
-webkit-transition: all 1s ease-in;
-moz-transition: all 1s ease-in;
-o-transition: all 1s ease-in;
transition: all 1s ease-in;
-webkit-transform: rotate(1deg);
-moz-transform: rotate(1deg);
-o-transform: rotate(1deg);
} 

img:out{border-radius: 60px;
opacity:1;filter:alpha(opacity=100);
-webkit-transform:scale(0.9):( Webkit: Scale down image to 0.8x original size);
padding:0px; float:center;
-moz-transform:scale(0.9):(Mozilla scale version);
-moz-transform:scale(0.9):(Explorer scale version);

}
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

9.كج شدن ساده تصوير به همراه واضح تر شدن


<style>
img:hover{ opacity:0.8;filter:alpha(opacity=80); -webkit-transform: rotate(-10deg); -moz-transform: rotate(-10deg);  } img:out{ opacity:10;filter:alpha(opacity=100); -webkit-transform: rotate(10deg); -moz-transform: rotate(10deg);  } 
img{ opacity:0.8;filter:alpha(opacity=80); } img:hover{ opacity:1;filter:alpha(opacity=100);  } img:out{ opacity:0.8;filter:alpha(opacity=80);  }
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

10.فقط گرد شدن گوشه هاي عكس


<style>
img{border-radius: 40px;
opacity:1;filter:alpha(opacity=100);
-webkit-transform:scale(0.9):( Webkit: Scale down image to 0.8x original size);
padding:0px; float:center;
-moz-transform:scale(0.9):(Mozilla scale version);
-moz-transform:scale(0.9):(Explorer scale version);

}
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

11.از كج به صاف تبديل شدن ، همراه با سايه


<style>

      /*Efect by : Mosbataye-bahejab.LOXBLOG.COM*/  
      img{-moz-transition:0.4s;-o-transition:0.4s;-ms-transition:0.4s;-khtml-transition:0.4s;-webkit-transition:0.4s;transition:0.4s;  
        border-radius:15px;box-shadow:0px 0px 10px #000;  
        -moz-transform:rotate(-1.5deg);-o-transform:rotate(1.5deg);-ms-transform:rotate(1.5deg);-webkit-transform:rotate(1.5deg);-khtml-transform:rotate(1.5deg);}  
      img:hover{border-radius:0px;  
      -moz-transform:rotate(0deg) scale(1.1);-o-transform:rotate(0deg);-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);-khtml-transform:rotate(0deg);  
        box-shadow:0px 0px 20px #9c9c9c;}  

</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

12.برجسته شدن لينك ها با رفتن موس


<style>
a:hover{
box-shadow:1px 4px 5px;
-moz-box-shadow:1px 4px 5px;
-o-box-shadow:1px 3px 4px;
-ms-box-shadow:1px 3px 4px;
-khtml-box-shadow:1px 3px 4px;
-webkit-box-shadow:1px 3px 4px;}

</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

13.چرخيدن ستاره دور لينك ها با رفتن موس


<style>
a:visited{color:#000000;text-decoration: none}a:hover{background:url(https://s2.picofile.com/file/7782873759/20.gif);text-decoration: none}
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

14.سايه دار شدن لينك

<style>
a:hover{
text-shadow:0px 2px 3px;
-moz-text-shadow:0px 2px 3px;
-o-text-shadow:0px 2px 3px;
-ms-text-shadow:0px 2px 3px;
-khtml-text-shadow:0px 2px 3px;
-webkit-text-shadow:0px 2px 3px;}
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

15.از مستطيل كوچك به دايره بزرگ تبديل شدن با رفتن ماوس


<style>
img:hover{border-radius: 50px;
opacity:0.8;filter:alpha(opacity=80);
-webkit-transform:scale(1.1):( Webkit: Scale up image to 1.2x original size);
-moz-border-radius:6px;-webkit-border-radius:30px;
box-shadow: 10px 10px 5px #000;
-moz-transform:scale(1.1):( Mozilla scale version);
-moz-transform:scale(0.9):(Explorer scale version);
}
img:out{border-radius: 40px;
opacity:1;filter:alpha(opacity=100);
-webkit-transform:scale(0.9):( Webkit: Scale down image to 0.8x original size);
padding:0px; float:center;
-moz-transform:scale(0.9):(Mozilla scale version);
-moz-transform:scale(0.9):(Explorer scale version);
}
img{
-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}
img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/
box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
-webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
-moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
opacity: 1;
} 
</style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

16.كد سياه و سفيد كردن تمامي تصاوير وبلاگ

<style> img { 
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'https://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); filter: gray; -webkit-filter: grayscale(100%); filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); 
transition: 1.5s; -webkit-transition: 1.5s; -moz-transition: 1.5s; -o-transition: 1.5s; -ms-transition: 1.5s; -khtml-transition: 1.5s; } img:hover{ -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%); -ms-filter: grayscale(0%); -o-filter: grayscale(0%); 
filter: none; 
transition: 1.5s; -webkit-transition: 1.5s; -moz-transition: 1.5s; -o-transition: 1.5s; -ms-transition: 1.5s; -khtml-transition: 1.5s; } </style>
<P><A href="https://webiha-pix.loxblog.com/" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>کد ِکج شدَنِ تَصآوير
</FONT></SPAN></A></P>
<P><A href="https://online3da.ir" target=_blank><SPAN
style="FONT-WEIGHT: 600; TEXT-DECORATION: none"><FONT 
color=#ff99cc>
</FONT></SPAN></A></P>

کد افکت گذاري بر روي عکس هاي وبلاگ و سايت

کد کج شدن ، سايده دار شدن و ... عکس

نحوه استفاده :

در صورتي که انجام مراجا ذيل را براي خود مشکل مي بينديد ؛ کد را در قسمت تنظيمات ، بخش کد هاي اضاقي يا اسکريپ ها وبلاگ خود کپي کنيد .

1- به قسمت ويرايش قالب خود برويد و کد < head > يا < head /> را پيدا کنيد

2- کد مورد نظر را بين اين دو کپي کنيد

ترجمه اين صفحه توسط ايران تم انجام شده است

طرح مورد نظر خود را با من در ميان بگذاريد

کد افکت گذاري بر روي عکس هاي وبلاگ و سايت

کد کج شدن ، سايده دار شدن و ... عکس

نحوه استفاده :

در صورتي که انجام مراجا ذيل را براي خود مشکل مي بينديد ؛ کد را در قسمت تنظيمات ، بخش کد هاي اضاقي يا اسکريپ ها وبلاگ خود کپي کنيد .

1- به قسمت ويرايش قالب خود برويد و کد < head > يا < head /> را پيدا کنيد

2- کد مورد نظر را بين اين دو کپي کنيد

ترجمه اين صفحه توسط ايران تم انجام شده است

طرح مورد نظر خود را با من در ميان بگذاريد

ورود کاربران

فراموشی رمز عبور

ثبت نام کاربران

نظرات کاربران