රැවටිල්ල - CSS සමඟ Copy-And-Paste නැවතිම

රැවටිල්ල - CSS සමඟ Copy-And-Paste නැවතිම

දවස් 6 කින් විතර මුකුත් ලියන්න බැරිවුනා ,මේකත් නිකම් පාලුවට ගිහිල්ලා වගේ . අනේ දුකෙත් බෑ ! ; හරි හරි අද කියන්න යන්නේ තමගේ කියලා වටින දෙයක් වෙබ් අඩ්වියක තියවානම් ඒක බේරගන්න පුලුවන් , පට්ට සරල ක්‍රමයක් ගැන . මේක ඉතින් ඔන්න අර පරණ තාලේ javascript එකක් නම් නෙවෙයි , හපෝ ඔයාලා දන්නනවානේ ,  browser එකෙන් javascript disable කරපු ගමන් ඉතින් script ඔක්කොටම බඩු පැකට්නේ . අද මම කියන්න යන්නේ CSS යොදාගෙන කොහොමද තමන්ගේ දේවල් හොරුන්ගෙන් බේරගන්නේ කියලා .මේකත් මම අද ගෙදර නිසා azarask.in බ්ලොග් එක කියවන කොට හම්බවුණා . ලියලා ඉවර කරන්න ඕනේ හැකින් පොස්ට් ටිකත් draft කරලා තියන ගමනම තමා මේකත් ලියන්න හිතුණේ .

හරි අපි වැල් වටාරන් නැතුව වැඩේට බහිමුකෝ . දැන් හිතන්න අපේ වැදගත් කියලා හිතන විස්තර ටිකක් වෙබ් අඩවියක තියනවා කියලා . හිතන්න මේ තියන විස්තර අපිට ඔය web bot ලගෙනුයි , web scrapping කරන අයගෙනුයි බේරගෙන , සාමාන‍ය මිනිසුන්ට තියන දේ තේරුම්ගන්න පුලුවන් විදිහට පෙන්නන්න ඕනේ කියලා, අන්න ඒක තමා අපි මෙතැනදි CSS භාවිතාකරගෙන කරන්න බලාපොරොත්තු වෙන්නේ . මෙහි අපි මුලිකවම කරන්නේ HTML එකේ source එක CSS යොදාගෙන mix කරනවා bot කෙනෙකුට අඳුනගන්න අමාරුවෙන්න , නමුත් මෙහි visual rending ( browser එකෙන් අපිට පෙනෙන සාමානය විදිහ ) එක කියවිය හැකි ලෙස තියෙනවා . පහත විඩියෝ කට්ට බලන්නකෝ.






හරි දැන් ඔයාලා විඩියෝ එක බැලුවානේ දැන් බලමුකෝ ඒවගේ CSS යොදාගෙන හදාගන්නේ කියලා .
හරි මුලින්ම බලමුකෝ විඩීයෝ විදිහට  ;
* කොහොමද තමන්ගේ e-mail එක බේරගන්නේ කියලා .

Demo :

  kodagod[REMOVETHIS]aashan@ya
[REMOVETHIS]hoo.com       

ඉහත මගේ e-mail ලිපිනය ඇත . දැන් එය කොපි කර වෙන තැනකට පිටපත් කරන්නකෝ . පේන්වානේ වුන වැඩේ . e-mail එක අතරට "[REMOVETHIS]" කියලා ආවා . ඉස්සෙල්ලාම පහත කේතය බලන්නකෝ .

කේතය :

<div>
<style>
.z{
  float:right;
  font-size:.001px;
  color:transparent;
  display:inline-block;
  width:0px;
  }
  </style>
&nbsp; kodagod<span class="z">[REMOVETHIS]</span>aashan@ya<span class="z">
[REMOVETHIS]</span>ho<span class="y">o.c</span>om</div>

හරි කේතය ගැන බැලුවොත් ඔයාලට පේනවා ඇති මම CSS වල  . z වලින් class එකක් ලියලා තියනව බව . ඔකෙන් අපිට වැදගත් වෙන්නේ z class  එකේ colour  එක transparent (කරලා තියන එකයි . එතකොට මෙතැනදි වෙන්නේ අපි .z class එක call කරලා ලියන්න ඕනේ දේ ඒක ඇතුලේ ලියුවහම , අපි ඒ ලියපු වචන කිහිපය බලන අපිට නොපෙන්වා source එකේ පමනක් හැංගිලා තියනවා . සරලව කියුවොත් අපි ඔය z class තුල ලියලා තියන ඒවා ඔයාලට පෙන්නේ නෑ , නමුත් ඔයාලා e-mail එක කොපි කරන්න හැදුවොත් browser  එක දන්නේ නැ , ඔය e-mail එක තුල තියන අනික් වචන ටික .browser එක ඔය ඔක්කොම කොපි කරලා දෙනවා .

* කොහොමද බ්ලොග් හොරුන්ගෙන් තමන්ගේ post බේරගන්නේ කියලා .

අනික් එක තමා මේක යොදාගන්න පුලුවන් ඔය web scrapping වගේ වැඩ වලින්. web scrapping වල්දී මුලිකවම කරන්නේ වෙනත් වෙබ් අඩවි වල තිබෙන දත්ත bot කෙනෙක් ඇතිව හෝ නැතිව ස්වයංක්‍රියවම ලබගැනිමයි . දැන් ඔය අපේ බ්ලොග් අවකාශයෙත් ඉන්නේ එහෙම් පිටින්ම පොස්ට් අච්චු ගහන එවුන් . අන්න ඒ වගේ එවුන්ගෙන් වුන්ත් තමන්ගේ පොස්ට් බේරගන්නත් මේ ක්‍රමය භාවිතා කරන්න පුළුවන් .

Demo :

  තොඩ්වව්ඩ්ෆ්ග්ස්ල්ක්රතුරුඩ්වව්ඩ්ෆ්ග්ස්ල්ක් සහ සන්නිවේදන Information and communication technologies (ICT) යඩ්වව්ඩ්ෆ්ග්ස්ල්ක්නු තොරඩ්වව්ඩ්ෆ්ග්ස්ල්ක්තුරු සැඩ්වව්ඩ්ෆ්ග්ස්ල්ක්කසුම් සහ සන්නිවේදනය සමිබන්ධ සියලු පැතිකඩ ආවරණය කෙරෙන යෙදුඩ්වව්ඩ්ෆ්ග්ස්ල්ක්මකි.මෙතුඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ළින් මූඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ලික වශඩ්වව්ඩ්ෆ්ග්ස්ල්ක්යෙන් ප්‍රාථමික-ඩිජිටල්(pre-digital) තාක්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ෂණයන් ,එනම් මුද්‍රිත තාක්ෂණයන් ද ඇතුඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ලත්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ව විස්තර කෙරුනද, ප්‍රධාඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්න වඩ්වව්ඩ්ෆ්ග්ස්ල්ක්ශයෙඩ්වව්ඩ්ෆ්ග්ස්ල්ක්න්ම විස්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්තර කරඩ්වව්ඩ්ෆ්ග්ස්ල්ක්නු ලඩ්වව්ඩ්ෆ්ග්ස්ල්ක්බන්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්නේ තොඩ්වව්ඩ්ෆ්ග්ස්ල්ක්රතුඩ්වව්ඩ්ෆ්ග්ස්ල්ක්රැ සන්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්නිව්ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්දනයට යෙදාගන්නා ඩිජිටල් ෆ්ග්ස්ල්ක්තාක්ෆ්ග්ස්ල්ක්ෂණ විධි ෆ්ග්ස්ල්ක්ක්‍රම( සන්නිෙව්දන ටොෆ්ග්ස්ල්ක්කෝල,සම්ෙපේෂණය උපක්‍රම,සන්නිෙව්දන උපකරණ, මාධ්ය සන්නිෙව්දනය) සෆ්ග්ස්ල්ක්හ තොරෆ්ග්ස්ල්ක්තුරැ ගබෆ්ග්ස්ල්ක්ඩා කිරිෆ්ග්ස්ල්ක්ම සහ සැකෆ්ග්ස්ල්ක්සුම් (ගණනෆ්ග්ස්ල්ක්ය කිරීෆ්ග්ස්ල්ක්ම,දත්ෆ්ග්ස්ල්ක්ත ගබෆ්ග්ස්ල්ක්ඩා කිරිෆ්ග්ස්ල්ක්ම)උෆ්ග්ස්ල්ක්පක්‍රෆ්ග්ස්ල්ක්මයෆ්ග්ස්ල්ක්න්ෆ්ග්ස්ල්ක්ය.මෙෆ්ග්ස්ල්ක්ම යෙෆ්ග්ස්ල්ක්දුෆ්ග්ස්ල්ක්ම ජනප්‍රයතාෆ්ග්ස්ල්ක්වයක් අෆ්ග්ස්ල්ක්ත්පෆ්ග්ස්ල්ක්ත් කෆ්ග්ස්ල්ක්රගැනීමෆ්ග්ස්ල්ක්ට පාෆ්ග්ස්ල්ක්ර්ෂ්විෆ්ග්ස්ල්ක්ක හේෆ්ග්ස්ල්ක්තුවෆ්ග්ස්ල්ක්ක් වූෆ්ග්ස්ල්ක්යේ තොෆ්ග්ස්ල්ක්රතුෆ්ග්ස්ල්ක්රු තාෆ්ග්ස්ල්ක්ක්ෂෆ්ග්ස්ල්ක්ණය සහ ටෙෆ්ග්ස්ල්ක්ලිකොෆ්ග්ස්ල්ක්ම් තාෆ්ග්ස්ල්ක්ක්ෂෆ්ග්ස්ල්ක්ණය සන්ෆ්ග්ස්ල්ක්නිපාතෆ්ග්ස්ල්ක්නෆ්ග්ස්ල්ක්යෆ්ග්ස්ල්ක්යිෆ්ග්ස්ල්ක්.      

ඉහත ඡේදය පිටපත් කරගෙන වෙන තැනක paste කරලා බලන්නකෝ මොකද වෙන්නේ කියලා . නිකම් වචන අදුනගන්න බැරි විකාරයක් පේනවා නේද (වැඩිය ඕක remix කරන්න ගියේ නෑ , ලිපිය ඉක්මනට කොටාගන්නත් ඕනේ නේ .... )??

 කේතය :

<div>
<style>
.z{
  float:right;
  font-size:.001px;
  color:transparent;
  display:inline-block;
  width:0px;
  </style>
තො<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>රතුරු<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>  සහ සන්නිවේදන Information and communication technologies undefinedICT)  ය<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>නු තොර<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>තුරු සැ<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>කසුම් සහ සන්නිවේදනය සමිබන්ධ සියලු පැතිකඩ ආවරණය කෙරෙන යෙදු<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>මකි.මෙතු<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ළින් මූ<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ලික වශ<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>යෙන් ප්‍රාථමික-ඩිජිටල්undefinedpre-digital) තාක්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ෂණයන් ,එනම් මුද්‍රිත තාක්ෂණයන් ද ඇතු<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ලත්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ව විස්තර කෙරුනද, ප්‍රධා<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span><span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>න ව<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>ශයෙ<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>න්ම විස්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>තර කර<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>නු ල<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>බන්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>නේ තො<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>රතු<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>රැ සන්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>නිව්<span class="z">ඩ්වව්ඩ්ෆ්ග්ස්ල්ක්</span>දනයට යෙදාගන්නා ඩිජිටල් <span class="z">ෆ්ග්ස්ල්ක්</span>තාක්<span class="z">ෆ්ග්ස්ල්ක්</span>ෂණ විධි <span class="z">ෆ්ග්ස්ල්ක්</span>ක්‍රමundefined සන්නිෙව්දන ටො<span class="z">ෆ්ග්ස්ල්ක්</span>කෝල,සම්ෙපේෂණය උපක්‍රම,සන්නිෙව්දන උපකරණ, මාධ්ය සන්නිෙව්දනය) ස<span class="z">ෆ්ග්ස්ල්ක්</span>හ තොර<span class="z">ෆ්ග්ස්ල්ක්</span>තුරැ ගබ<span class="z">ෆ්ග්ස්ල්ක්</span>ඩා කිරි<span class="z">ෆ්ග්ස්ල්ක්</span>ම සහ සැක<span class="z">ෆ්ග්ස්ල්ක්</span>සුම් undefinedගණන<span class="z">ෆ්ග්ස්ල්ක්</span>ය කිරී<span class="z">ෆ්ග්ස්ල්ක්</span>ම,දත්<span class="z">ෆ්ග්ස්ල්ක්</span>ත ගබ<span class="z">ෆ්ග්ස්ල්ක්</span>ඩා කිරි<span class="z">ෆ්ග්ස්ල්ක්</span>ම)උ<span class="z">ෆ්ග්ස්ල්ක්</span>පක්‍ර<span class="z">ෆ්ග්ස්ල්ක්</span>මය<span class="z">ෆ්ග්ස්ල්ක්</span>න්<span class="z">ෆ්ග්ස්ල්ක්</span>ය.මෙ<span class="z">ෆ්ග්ස්ල්ක්</span>ම යෙ<span class="z">ෆ්ග්ස්ල්ක්</span>දු<span class="z">ෆ්ග්ස්ල්ක්</span>ම ජනප්‍රයතා<span class="z">ෆ්ග්ස්ල්ක්</span>වයක් අ<span class="z">ෆ්ග්ස්ල්ක්</span>ත්ප<span class="z">ෆ්ග්ස්ල්ක්</span>ත් ක<span class="z">ෆ්ග්ස්ල්ක්</span>රගැනීම<span class="z">ෆ්ග්ස්ල්ක්</span>ට පා<span class="z">ෆ්ග්ස්ල්ක්</span>ර්ෂ්වි<span class="z">ෆ්ග්ස්ල්ක්</span>ක හේ<span class="z">ෆ්ග්ස්ල්ක්</span>තුව<span class="z">ෆ්ග්ස්ල්ක්</span>ක් වූ<span class="z">ෆ්ග්ස්ල්ක්</span>යේ තො<span class="z">ෆ්ග්ස්ල්ක්</span>රතු<span class="z">ෆ්ග්ස්ල්ක්</span>රු තා<span class="z">ෆ්ග්ස්ල්ක්</span>ක්ෂ<span class="z">ෆ්ග්ස්ල්ක්</span>ණය සහ ටෙ<span class="z">ෆ්ග්ස්ල්ක්</span>ලිකො<span class="z">ෆ්ග්ස්ල්ක්</span>ම් තා<span class="z">ෆ්ග්ස්ල්ක්</span>ක්ෂ<span class="z">ෆ්ග්ස්ල්ක්</span>ණය සන්<span class="z">ෆ්ග්ස්ල්ක්</span>නිපාත<span class="z">ෆ්ග්ස්ල්ක්</span>න<span class="z">ෆ්ග්ස්ල්ක්</span>ය<span class="z">ෆ්ග්ස්ල්ක්</span>යි<span class="z">ෆ්ග්ස්ල්ක්</span></div>

ඉහත උදාහරනයේ කරලා තියන්නේ ඡේදය අතර z class එක ගොඩ සැරයක් යොදාගෙන තියනවා .

 * කොහොමද phishing වලට මේ ක්‍රමය යොදාගන්නේ කියලා .

දැන් ඔය phishing වලදි බොහෝ අය කියන්නේ තමන්ම , ඕනෙම වෙබ් අඩවියක URL එක copy කරලා paste කලොත් එල කියලනේ . ඒ වුනත් පහත් Demo එක බලන්නකෝ මොකද වෙන්නේ කියලා . ඔකේ තියන address එක කොපි කරලා address bar එකේ paste කරලා බලන්නකෝ .

Demo :

  http://spam.virus.hacker.facebook.com

දැක්කනේ මොකද වුනේ කියලා , ඒක නිසා Web Address එක්ක කටයුතු කරන කොට.

කේතය :

<div>
<style>
.z{
  float:right;
  font-size:.001px;
  color:transparent;
  display:inline-block;
  width:0px;
  }
  
</style>
<blockquote>
&nbsp; http://<span class="z">spam.virus.hacker.</span>facebook.com</blockquote>
</div>

හරි මම දැන් ඔය විඩියෝ එකේ තියන ඒවා ඔක්කොම කියුවනේ , මට මතක් වුන තව වැදගත් කියලා හිතන තැන් දෙකක් පෙන්වන්නම්කෝ මෙම ක්‍රමය භාවිතා කරන .

* කොහොමද picture එකක් බේරගන්න මේ ක්‍රමය යොදාගන්නේ කියලා.
හිතන්න අපේ වෙබ් අඩවියේ තිබෙන පින්තුර කාටවත් කොපි කරගන්න බැරිවෙන විදිහට හදාගන්න ඔනේ කියලා . එහෙනම් ඒක කර්ගන්නත් මේ CSS එක භාවිතා කරන්න පුලුවන් . පහත demo එක බලන්නකෝ .පුලුවන්නම් ඒක කොපි කරගන්න බලන්න (*source code එක බලලා URL එක ගන්නේ නැතුව) .

Demo :

කේතය :

<div id="images1" style="overflow: hidden; position: absolute; width: 142px; height: 200px; z-index: 0;">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdpVu9zUzLeRhKzltKKHO68RFteEfddJSkkEmD4E1kQqlP__9t5y3MGpKA9G9ZQSaL_pIdFkemNrWQJpFpAnlVuKeo_g9cAN6B0RhSE-WbeRqlUPm-VoUkeHQc_qbG8B9wuXy5Wg1s5tw/s200/flower-dewlance.gif" border="0" alt="" width="142" height="200" /></div>
<div id="images2" style="overflow: hidden; position: absolute; width: 145px; height: 202px; z-index: 1;">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrGSH-Wd2SBwFscl16ycj0WIeEzi9jnpRixOaQdvifGUuyv-lqKq8QrhOLHcyNryv7UVx8Nas9vVNH7Gmdls9pYkEkRfznnFA1Bl2V7ochAShwvzQTl086YzRX00TxxPulePZCyAjTv40/s320/1pixel-transparentimage.gif" border="0" alt="" width="1" height="1" /></div>

මෙතැන කරලා තියන්නේ අපිට ආරක්ෂා කීරිමට අවශය පින්තුරය , 1px*1px විනිවිද පෙනෙන පින්තුරයක් මඟින් ආවරණය කර තිබේ (අපේ ආරක්ෂා කීරිමට අවශය පින්තුරයට උඩින් 1px*1px විනිවිද පෙනෙන පින්තුරය දමා තිබේ ). මේක ගොඩක් වටිනවා වගේම 1px*1px විනිවිද පෙනෙන පින්තුරයට වැයවනුයේ 43 bytes වැනි කුඩා ප්‍රමාණයක් නිසා bandwidth එක ගැන බය විමට දෙයක් නැත  .

* කොහොමද තමන්ගේ text බේරගන්න මේ ක්‍රමය යොදාගන්නේ කියලා.

ඉහත භාවිතා කල ක්‍රමයම අපිට අපේ text බේරාගැනිමටත් භාවිතා කල හැක . ඒ කියන්නේ මෙවර picture එකක් වෙනුවට තියන්නේ text තිබෙන අතර  අප 1px*1px විනිවිද පෙනෙන පින්තුරය මඟින් එම text සියල්ලම වසා දමනු ලැබේ .

Demo :

කේතය :

<div id="images1" style="overflow: hidden; position: absolute; width: 142px; height: 200px; z-index: 0;"><b><h2>Copy me if you can ?? ; පුලුවන් නම් මාව කොපි කරන්නකෝ ??? </h2></b></div>
<div id="images2" style="overflow: hidden; position: absolute; width: 145px; height: 202px; z-index: 1;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrGSH-Wd2SBwFscl16ycj0WIeEzi9jnpRixOaQdvifGUuyv-lqKq8QrhOLHcyNryv7UVx8Nas9vVNH7Gmdls9pYkEkRfznnFA1Bl2V7ochAShwvzQTl086YzRX00TxxPulePZCyAjTv40/s320/1pixel-transparentimage.gif" border="0" alt="" width="1" height="1" /></div>

මොකද හිතන්නේ මේ ගැන , ඔය පහළින් කොමෙන්ට් එකක් දාලම යන්නකෝ !!!

Source : blog.dewlance.com , azarask.in