ورش العرب

ورش العرب
 
الرئيسيةأحدث الصوردخولالتسجيل

 

 اضافة ايقونات روعة بالموضوع من مايكل سوفت

اذهب الى الأسفل 
كاتب الموضوعرسالة
Michael_vx
عضو جديد
عضو جديد
Michael_vx


ذكر
عدد المساهمات : 11
نقآط النشآط : 25
السٌّمعَة : 0
احترام قوانين المنتدى : اضافة ايقونات روعة بالموضوع من مايكل سوفت 96680d1fc40a093
تاريخ التسجيل : 10/04/2015

اضافة ايقونات روعة بالموضوع من مايكل سوفت Empty
مُساهمةموضوع: اضافة ايقونات روعة بالموضوع من مايكل سوفت   اضافة ايقونات روعة بالموضوع من مايكل سوفت Emptyالأحد أبريل 19, 2015 11:53 am

هذا الاسكربت سيمكنك من اضافة قائمة ايقونات رائعة جدا تضاف للموضوع او الرد
صورة
اضافة ايقونات روعة بالموضوع من مايكل سوفت Image
اما عن طريقة التركيب فستكون بكودين فقط
الاول ورقة التصميم css
كود :
الكود:
/* ايقونات روعة من مايكل سوفت */

.sceditor-container textarea { font-family:Verdana, Arial, Helvetica, sans-serif, FontAwesome !important }

/* button image */

.sceditor-button-fontawesome div { background:url(http://i19.servimg.com/u/f19/19/06/98/92/fa-f10.png) !important }



/* drop down */

.sceditor-fontawesome {

  width:220px;

  height:250px;

  overflow-y:auto;

}



/* icons */

.sceditor-fontawesome i {

  color:#333;

  font-size:20px;

  text-align:center;

  cursor:pointer;

  padding:3px 0;

  width:25%;

}

.sceditor-fontawesome i:hover { color:#666 }

الكود التالى هو جافا سكربت
اسم العنصر كما تريد
مكان الظهور جميع الصفحات

كود :
الكود:
(function() {



      var FA = 'http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css',

          a = document.createElement('LINK');

      a.rel = 'stylesheet';

      a.type = 'text/css';

      a.href = FA;

      document.getElementsByTagName('HEAD')[0].appendChild(a);

    })();



$(function(){

      if (!$.sceditor) return;

      var defaultSize = 29, // default icon size

          autoClose = 1, // closes drop down after an icon is clicked, if enabled

      

          // icon list

          fa =
['','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','',''],
 A = '', O = A, i, j = fa.length;

      

      // if the size is above 0 we'll format a default size for the icons

      if (defaultSize) {

        A += '';

        O += '';

      }

      

      // create sceditor button and drop down

      $.sceditor.command.set('fontawesome', {

        createDropdown : function(editor, callback) {

          var c = $('<div />');



          for (i = 0; i<j; i++) {

            $('<i class="fa">' + fa[i] + '</i>').click(function(e) {

              callback($(this).text());



              autoClose && editor.closeDropDown(true);

              e.preventDefault();

            }).appendTo(c);

          }



          return c;

        },



        // wysiwyg

        exec : function(c) {

          var e = this;

          e.createDropDown(c, 'fontawesome', $.sceditor.command.get('fontawesome').createDropdown(e, function(I) {

            e.insert('&nbsp;[font=FontAwesome]' + A + I + O + '[/font]&nbsp;', '', true, true, true);

          }));

        },

        // source

        txtExec : function(c) {

          var e = this;

          e.createDropDown(c, 'fontawesome', $.sceditor.command.get('fontawesome').createDropdown(e, function(I) {

            e.insert(' [font=FontAwesome]' + A + I + O + '[/font] ', '');

          }));

        },

        

        tooltip : 'ايقونات روعه مايكل سوفت'

      });

      

      toolbar = toolbar.replace(/date,/,'fontawesome,date,'); // add the button to the toolbar

    });

اضافة ايقونات روعة بالموضوع من مايكل سوفت 55454

على مايكل سوفت
الرجوع الى أعلى الصفحة اذهب الى الأسفل
 
اضافة ايقونات روعة بالموضوع من مايكل سوفت
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» مايكل سوفت
» الى مايكل سوفت بخصوص قاعدة البيانات
»  حصرى كود الدخول الاحترافى واعادة التوجيه لنفس الصفحة من مايكل سوفت

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
ورش العرب :: قسم الآبداع التصميم :: آلقسم التطويري-
انتقل الى: