أهلا وسهلا بك زائرنا الكريم في منتدى دعم PBBoard الرسمي، لكي تتمكن من المشاركة ومشاهدة جميع أقسام المنتدى وكافة الميزات ، يجب عليك إنشاء حساب جديد بالتسجيل بالضغط هنا أو تسجيل الدخول اضغط هنا إذا كنت عضواً .

طريقة توهج الروابط عند مرور الماوس



  • [شرح]:
14-12-2012 02:14 مساءً
sofiene2012
معلومات الكاتب
السلام عليكم



في هذا الشرح سنتعرف على كيفية جعل الروابط في المنتدى متوهجة بألوان قوس قزح بمجرد مرور الماوس عليها



نفتح قالب headinclud

نضيف في آخره الكود التالي


CODE

    <!-- Example of  Normal LINK -->

    <!-- Example of MouseOver Text -->
     <SPAN name="rl" onmouseover="doRainbow(this);" and onmouseout="stopRainbow();"></SPAN>


    <!-- Copy-Paste the code below into your HTML document -->
    <!--  just above </BODY> Tag -->

    <SCRIPT LANGUAGE="JavaScript">
    <!-- ;

    /*********************************************************************/
    /* Rainbow Links or Text                                            */
    /* This script and many more are available free online at            */
    /* http://rainbow.arch.scriptmania.com                              */
    /*                                                                  */
    /* Usage:                                                            */
    /* Insert just above end/close BODY Tag,                            */
    /* For Links                                                        */
    /* You don't need to add "onMouseover" and "onMouseout" attributes!! */
    /*                                                                  */
    /* If you'd like to add effect to other text, then                  */
    /* add 'onmouseover="doRainbow(this);"' and                          */
    /* 'onmouseout="stopRainbow();"' to the target tags.                */
    /*                                                                  */
    /* This Script works with IE4,Netscape6,Mozilla browser and above,  */
    /* but no error occurs on other browsers.                            */
    /*********************************************************************/


    // Setting
    //- SPEED CAN BE CHANGED HERE -

    var rate = 25;  // Increase-Decrease amount ( Higher=Faster )

    // - DO NOT ALTER BELOW -
    // Main routine

    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()
    {
       
        // HSVtoRGB
        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>



بالتوفيق للجميع
تم تحرير الموضوع بواسطة :sofiene2012 بتاريخ: 14-12-2012 02:15 مساءً


look/images/icons/i1.gif طريقة توهج الروابط عند مرور الماوس
  14-12-2012 10:43 مساءً   [1]
AHMED
معلومات الكاتب
جزاك الله خيرا اخى الكريم و بارك لك

look/images/icons/i1.gif طريقة توهج الروابط عند مرور الماوس
  16-12-2012 03:29 مساءً   [2]
أبا إبراهيم
معلومات الكاتب
روعة اخي الكريم

بارك الله فيك ونفع بك

look/images/icons/i1.gif طريقة توهج الروابط عند مرور الماوس
  27-01-2013 12:33 مساءً   [3]
Arbesk.CoM
معلومات الكاتب
بارك الله فيك اخى الكريم

look/images/icons/i1.gif طريقة توهج الروابط عند مرور الماوس
  17-02-2013 05:38 مساءً   [4]
ibrahem
معلومات الكاتب
اسف ولكنى مبتدأ اين اجد قالب headinclud

look/images/icons/i1.gif طريقة توهج الروابط عند مرور الماوس
  18-02-2013 12:42 مساءً   [5]
عبدالرحمن
معلومات الكاتب
لوحة التحكم >> الاستايلات والقوالب >> تحرير القوالب >> اختر الاستايل >> وحط تحرير >> وابحث عن القالب >> وحط تحرير >> واضف اخره الكود >> وحط حفظ !! فقط





مشكوووووور ااخوي طرح رائع وجميل يعطيك الف عافيه

look/images/icons/i1.gif طريقة توهج الروابط عند مرور الماوس
  22-03-2013 09:46 صباحاً   [6]
raf200
معلومات الكاتب
روعة جداً.



بس كل دا كود عشان توهج ؟؟



هههههههه



تحياتى لكـ،،:)



الكلمات الدلالية
لا يوجد كلمات دلالية ..






الساعة الآن 05:09 AM