‏إظهار الرسائل ذات التسميات html. إظهار كافة الرسائل
‏إظهار الرسائل ذات التسميات html. إظهار كافة الرسائل


101 خط لمصممي المواقع

bemio

السلام عليكم 
اتيت لكم ب 101 خط مجاني 



البحث داخل جدول عن طريق الjquery

السلام عليكم ورحمة الله وبركاته
اليوم اتيت لكم بطريقة عمل جدول به خاصية البحث عن طريق الjquery 
مثال على الدرس Table Filter Bootstrap + Jquery - JSFiddle
طبعا الدرس يحتاج انك تعرف BOOTSTRAP 

اذا كنت لاتعرف bootstrap ممكن انك تتعلمه عن طريق http://www.youtube.com/watch?v=-rct0ZvmX5M
او انك تاخذ الكود كامل من ديه الصفحة [HTML 5] الكود كامل لطريقة البحث داخل الجدول عن طريق الjquery - Pastebin.com نسخ لصق

الطريقة انك تضع كود الhtml هذا داخل كود الbootstrap
رمز PHP:
<div class="input-group"> <span class="input-group-addon">Filter</span>

    <
input id="filter" type="text" class="form-control" placeholder="Type here...">
</
div>
<
table class="table table-striped">
    <
thead>
        <
tr>
            <
th>Code</th>
            <
th>Name</th>
            <
th>Default</th>
            <
th>Status</th>
        </
tr>
    </
thead>
    <
tbody class="searchable">
        <
tr>
            <
td>EUR</td>
            <
td>EURO</td>
            <
td></td>
            <
td>Active</td>
        </
tr>
        <
tr>
            <
td>GBP</td>
            <
td>Pound</td>
            <
td></td>
            <
td>Active</td>
        </
tr>
        <
tr>
            <
td>GEL</td>
            <
td>Georgian Lari</td>
            <
td><span class="glyphicon glyphicon-ok"></span>
            </
td>
            <
td>Active</td>
        </
tr>
        <
tr>
            <
td>USD</td>
            <
td>US Dollar</td>
            <
td></td>
            <
td>Active</td>
        </
tr>
    </
tbody>
</
table>  
وتضع ده الكود داخل الjquery


رمز PHP:
$(document).ready(function () {

    (function ($) {

        $(
'#filter').keyup(function () {

            var 
rex = new RegExp($(this).val(), 'i');
            $(
'.searchable tr').hide();
            $(
'.searchable tr').filter(function () {
                return 
rex.test($(this).text());
            }).
show();

        })

    }(
jQuery));

});  
وبهذا يكون الكود كامل كده
[HTML 5] الكود كامل لطريقة البحث داخل الجدول عن طريق الjquery - Pastebin.com

وللمزيد من الدروس :دوروسانيا



الإتصال عن طريق الهواتف بالHTML5

السلام عليكم
اتيت لكم بطريقة الإتصال في الهواتف عن طريق ال
HTML5

الكود هو
<img width="100%" src="phone.png" onclick="window.location.href='tel:09098790815';" />
كل ماعليك تغيير 09098790815 الى الهاتف المراد الإتصال به

او يمكنك استدامه ك رابط
<a href="tel:09098790815"></a>


فلاتر على الصور بالCSS3


السلام عليكم اليوم اتيت لكم بفلاتر على الصور بال
CSS3 فقط
هنا امثلة مع الكود تبعها

http://demo.hongkiat.com/css-filter/index.html


ولتحميل الأمثلة


كود تضمين ملف html داخل ملف html

السلام عليكم ورحمة الله وبركاته
 اليوم اتيت لكم ب كود يجعلك قادرا على تضمين ملف اتش تي ام ال داخل ملف اخر والكود هو
<link rel="import" href="stuff.html"
 ونغير الرابط حق الملف بما يتناسب مع الملف المراد تضمينهheadطبعا نضيف الكود داخل ال


خاصية localStorage خاصية المخزن بديل session وcookies في الphp

السلام عليكم ورحمة الله وبركاته

قبل الدرس مثال جهزته النتيجة النهائية والكود كامل 
عشان تفهم التجربة غير القائمة بتلاقي الخلفية تغيرت جرب تحدث الصفحة بتلاقي الخلفية نفسها ماتغيرت ليش كيف الحركة ديه اذا تبغى تعرف تابع الدرس
هذا رابط التجربة :Edit this Fiddle - jsFiddle

,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,, ,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,, ,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,, ,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,, ,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,, ,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,, ,,,,,,

اليوم اتيت لكم بشرح localStorage هي تؤدي نفس وظيفة الcookies او session في الphp لكن القيم بدل ماتخزن في السيرفر تخزن في جهاز المستخدم فبيكون استيراد البيانات اخف لانه بتقل العمليات على السيرفر



عمل جدول مثل هذا بالcss

اليوم جايكم بدرس كيف تسوي جدول مثل اللي بالصورة الثمثال من هنا والكود من هنا
http://jsfiddle.net/FjNP8/




أزرار css3 مميزة وجميلة

السلام عليكم ورحمة الله وبركاته 
انا اليوم جايبلكم ازرار ابداع وحلوة بكل تأثيراتها يعني الزر عند
المرور عليه وعند الضغط وعند التعطيل
وشوفو الصور 

بأحجام مختلفة

كل ماعليك الا ان تحمل الكود من المرفقات وتضع بوتون
رمز PHP:
<button class="small button">زر صغير </button>
<
button class="largebutton">زر كبير</button>  
وبألوان مختلفة

تحمل من المرفقات وتضع الكود ده بالhtml
رمز PHP:
<button class="button">Button</button>
<
button class="color red button">زر لونه احمر</button>
<
button class="color green button">زر لونه اخضر</button>
<
button class="color blue button">زر لونه ازرق</button>  

أزرار disabled


رمز PHP:
<button class="button" disabled>Button</button>
<
button class="color red button" disabled>زر أحمل</button>
<
button class="color green button" disabled>أخضر</button>
<
button class="color blue button" disabled>أزرق</button>  
مجموعة أزرار




رمز PHP:
<ul class="button-group">
    <
li><button class="button">Button</button></li>
    <
li><button class="button">Button</button></li>
    <
li><button class="button">Button</button></li>
    <
li><button class="button">Button</button></li>
</
ul>  

ومن هنا لتجربة الأزرار CSS3 patterned buttons demo - RedTeamDesign
وللتحميل من هنا http://www.mediafire.com/?lrhl38dbeg0jggc




الرفع المتعدد php