Fragmente de coduri (code snippets)

Aici puteti posta fragmente mici de coduri care ar putea fi pe placul altor membri. Nu uitati sa postati niste imagini si/sau sursa unde este cazul.

---

Un cod CSS care poate schimba culorea implicita a textului si al fundalului atunci cand selectezi un text.

Exemplu:

[You must be registered and logged in to see this image.]

[You must be registered and logged in to see this image.]

Code:

/* SELECTARE TEXT */

::selection {
color: #000000 !important;
background: #FFA500 !important;}
::-moz-selection {
color: #000000 !important;
background: #FFA500 !important;}
::-webkit-selection{
color: #000000 !important;
background: #FFA500 !important;}

color - culoarea textului
background - fundalul

Este nevoie sa le folositi pe toate pentru a acoperi mai multe browsere. Codul din pacate nu functioneaza in IE.

Primul cod:

Code:

.lastpost{
margin: 3px;
width : auto;
border : 2px solid #EEE;
-moz-border-radius : 7px;
-webkit-border-radius : 7px;
border-radius : 7px;
-moz-box-shadow : 0 0 8px #666;
-webkit-box-shadow : 0 0 8px #666;
box-shadow : 0 0 8px #666;}

Acest cod punet-il in foaia de stil CSS
Un mic cod cu care puteti face un tabel in jurul Ultimului Mesaj

Al doilea cod:

Instalare:
P.A=>Afisare=>Pagina de start=>Generalitati=>Mesaj pe pagina de start=>Continutul mesajului

Code:


<script LANGUAGE="Javascript">
<!-- ;

var rate = 25;

if (document.getElementById)
window.onerror=new Function("return true")

var objActive;
var act = 0;
var elmH = 0;
var elmS = 128;
var elmV = 255;
var clrOrg;
var TimerID;

if (document.all) {
    document.onmouseover = doRainbowAnchor;
    document.onmouseout = stopRainbowAnchor;
}
else if (document.getElementById) {
    document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
    document.onmouseover = Mozilla_doRainbowAnchor;
    document.onmouseout = Mozilla_stopRainbowAnchor;
}
function doRainbow(obj)
{
    if (act == 0) {
        act = 1;
        if (obj)
            objActive = obj;
        else
            objActive = event.srcElement;
        clrOrg = objActive.style.color;
        TimerID = setInterval("ChangeColor()",100);
    }
}
function stopRainbow()
{
    if (act) {
        objActive.style.color = clrOrg;
        clearInterval(TimerID);
        act = 0;
    }
}
function doRainbowAnchor()
{
    if (act == 0) {
        var obj = event.srcElement;
        while (obj.tagName != 'A' && obj.tagName != 'BODY') {
            obj = obj.parentElement;
            if (obj.tagName == 'A' || obj.tagName == 'BODY')
                break;
        }

        if (obj.tagName == 'A' && obj.href != '') {
            objActive = obj;
            act = 1;
            clrOrg = objActive.style.color;
            TimerID = setInterval("ChangeColor()",100);
        }
    }
}
function stopRainbowAnchor()
{
    if (act) {
        if (objActive.tagName == 'A') {
            objActive.style.color = clrOrg;
            clearInterval(TimerID);
            act = 0;
        }
    }
}
function Mozilla_doRainbowAnchor(e)
{
    if (act == 0) {
        obj = e.target;
        while (obj.nodeName != 'A' && obj.nodeName != 'BODY') {
            obj = obj.parentNode;
            if (obj.nodeName == 'A' || obj.nodeName == 'BODY')
                break;
        }

        if (obj.nodeName == 'A' && obj.href != '') {
            objActive = obj;
            act = 1;
            clrOrg = obj.style.color;
            TimerID = setInterval("ChangeColor()",100);
        }
    }
}
function Mozilla_stopRainbowAnchor(e)
{
    if (act) {
        if (objActive.nodeName == 'A') {
            objActive.style.color = clrOrg;
            clearInterval(TimerID);
            act = 0;
        }
    }
}
function ChangeColor()
{
    objActive.style.color = makeColor();
}
function makeColor()
{

    if (elmS == 0) {
        elmR = elmV;    elmG = elmV;    elmB = elmV;



    }
    else {
        t1 = elmV;
        t2 = (255 - elmS) * elmV / 255;
        t3 = elmH % 60;
        t3 = (t1 - t2) * t3 / 60;

        if (elmH < 60) {
            elmR = t1;  elmB = t2;  elmG = t2 + t3;
        }
        else if (elmH < 120) {
            elmG = t1;  elmB = t2;  elmR = t1 - t3;
        }
        else if (elmH < 180) {
            elmG = t1;  elmR = t2;  elmB = t2 + t3;
        }
        else if (elmH < 240) {
            elmB = t1;  elmR = t2;  elmG = t1 - t3;
        }
        else if (elmH < 300) {
            elmB = t1;  elmG = t2;  elmR = t2 + t3;
        }
        else if (elmH < 360) {
            elmR = t1;  elmG = t2;  elmB = t1 - t3;
        }
        else {
            elmR = 0;  elmG = 0;  elmB = 0;
        }
    }

    elmR = Math.floor(elmR).toString(16);
    elmG = Math.floor(elmG).toString(16);
    elmB = Math.floor(elmB).toString(16);
    if (elmR.length == 1)    elmR = "0" + elmR;
    if (elmG.length == 1)    elmG = "0" + elmG;
    if (elmB.length == 1)    elmB = "0" + elmB;

    elmH = elmH + rate;
    if (elmH >= 360)
        elmH = 0;

    return '#' + elmR + elmG + elmB;
}
// end hide -->
</script>

Al treilea cod:

Code:

a:hover {
text-decoration: none !important;
}

Acest cod este pentru marirea textului cand pui cursorul pe el. Exemplu: ati creat un forum/o categorie care se numeste Reguli, cand veti pune cursorul pe el/ea va fi REGULI in loc de Reguli

Code:

a:hover {
text-decoration: none !important;
}

Instalare:
Copiati codurile respective in: PA=>Afisare=>Imagini si culori=>Culori=>Foaie de stil CSS

Al patrulea cod:

Cu ajutorul acestui cod puteti modifica cursorul dupa bunul plac
P.A=>Afisare=>Culori=>Faoie de stil CSS si copiati:

Code:

body{cursor: url(http://i66.servimg.com/u/f66/11/96/49/61/arrow11.png), progress;}

a:hover, a {cursor: url(http://i66.servimg.com/u/f66/11/96/49/61/hand11.png), progress;}

Inlocuiti

Code:

http://i66.servimg.com/u/f66/11/96/49/61/arrow11.png

cu imaginea principala a sagetii

Inlocuiti

Code:

http://i66.servimg.com/u/f66/11/96/49/61/hand11.png

Cu imagiena dorita cand puneti mouse-ul pe un link

Pentru staff: Scuzati folosirea bold-ului si italicului, dar am fost nevoit sa le folosesc pentru a evidentia numarul codului si modul sau de instalare

Alt cod css, acesta este pentru forumurile forumgratuit, schimba butoanele vechi de impartit aflate in bloguri sub articole in unele noi.

Implicit:
[You must be registered and logged in to see this image.]

Butoanele noi (plus un mic efect de hover):

[You must be registered and logged in to see this image.]

Code:

/* IMPARTE DE PE BLOG */

#bookmarks a img {
width: 16px;
height: 16px;
margin: 2px;
background: url(http://illiweb.com/fa/empty.gif) no-repeat ;}

#bookmarks img:hover {
filter:alpha(opacity=75);
opacity: 0.75;}

#bookmarks a img.twitter {
margin: 2px;
background: url(http://i64.servimg.com/u/f64/14/54/25/26/twitte13.png) no-repeat;
opacity: 1.0;}

#bookmarks a img.twitter:hover {
opacity: 0.75;}

#bookmarks img.digg {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/digg13.png) no-repeat;}

#bookmarks img.reddit {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/reddit10.png) no-repeat;}

#bookmarks img.delicious {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/delici12.png) no-repeat;}

#bookmarks img.google {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/google11.png) no-repeat;}

#bookmarks img.live {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/live11.png) no-repeat;}

#bookmarks img.facebook {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/facebo12.png) no-repeat;}

#bookmarks img.slashdot {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/slashd10.png) no-repeat;}

#bookmarks img.technorati {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/techno10.png) no-repeat;}

#bookmarks img.stumbleupon {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/stumbl13.png) no-repeat;}

#bookmarks img.newsvine {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/newsvi10.png) no-repeat;}

#bookmarks img.furl {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/furl10.png) no-repeat;}

#bookmarks img.yahoo {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/yahoo13.png) no-repeat;}

#bookmarks img.smarking {
background: url(http://i64.servimg.com/u/f64/14/54/25/26/smarki13.png) no-repeat;}

#bookmarks img.excite {
background: url(http://illiweb.com/fa/empty.gif) no-repeat scroll;
width: 0px;
height: 0px;}

#bookmarks img.netscape {
background: url(http://illiweb.com/fa/empty.gif) no-repeat scroll;
width: 0px;
height: 0px;}

Am ascuns 2 butoane si anume:
- Netscape pentru ca nu prea este folosit..
- Exite care este.. francez ()

Imaginile folosite le gasiti aici. Unele sunt facute de mine, fiind ca nu gaseam altele care sa se potrivesc.

Codul functioneaza pe toate versiunile

Smooth scroll jQuery script pentru cei care doresc putin stil pe site-urile lor. Am adaugat deja acest cod pe forum si am scris si pe twitter, pentru a va da seama la ce ma refer, dati click pe sagetuta din partea dreapta-jos al oricarui mesaj.

Code:

$(document).ready(function() {
  function filterPath(string) {
  return string
    .replace(/^\//,'')
    .replace(/(index|default).[a-zA-Z]{3,4}$/,'')
    .replace(/\/$/,'');
  }
  var locationPath = filterPath(location.pathname);
  var scrollElem = scrollableElement('html', 'body');

  $('a[href*=#]').each(function() {
    var thisPath = filterPath(this.pathname) || locationPath;
    if (  locationPath == thisPath
    && (location.hostname == this.hostname || !this.hostname)
    && this.hash.replace(/#/,'') ) {
      var $target = $(this.hash), target = this.hash;
      if (target) {
        var targetOffset = $target.offset().top;
        $(this).click(function(event) {
          event.preventDefault();
          $(scrollElem).animate({scrollTop: targetOffset}, 1000, function() {
            location.hash = target;
          });
        });
      }
    }
  });

  // use the first element that is "scrollable"
  function scrollableElement(els) {
    for (var i = 0, argLength = arguments.length; i <argLength; i++) {
      var el = arguments[i],
          $scrollElement = $(el);
      if ($scrollElement.scrollTop()> 0) {
        return el;
      } else {
        $scrollElement.scrollTop(1);
        var isScrollable = $scrollElement.scrollTop()> 0;
        $scrollElement.scrollTop(0);
        if (isScrollable) {
          return el;
        }
      }
    }
    return [];
  }
});

Adaugati codul in <head> intre:

Code:

<script type="text/javascript"> si </script>


Puteti adauga codul si intr-un fisier .js si sa il afisati astfel:

Code:

<script type="text/javascript" src="link-fisier-smooth-scroll.js"></script>

Schimbati din cod 1000 cu ce viteza doriti. (1000 milisecunde = o secunda, 2000 milisecunde = 2 secunde s.a.m.d)

Sursa: [You must be registered and logged in to see this link.]