شرح طريقة تركيب install معرض الصور المنبثق بمكتبة الquery

[Chakira]

http://www.dzbatna.com/images/icons/icon30.gif ط´ط±ط* طھط±ظƒظٹط¨ ظ…ط¹ط±ط¶ ط§ظ„طµظˆط± ط§ظ„ظ…ظ†ط¨ط«ظ‚ ط¨ظ…ظƒطھط¨ط© ط§ظ„query (http://www.dzbatna.com/t1784830/)




http://i47.tinypic.com/w9uyir.jpg
نقدم لكم هذه الأداة الرائعه, والتى ستستطيع بواسطتها ان تقوم بعمل مكتبة الصور لموقعك بطريقة العرض
المنبثقه بمكتبة الjquery الرائعه

شاهد مثال عملى :

http://i43.tinypic.com/2cz8vpy.png (http://www.advphp.com/tuts/js/photogallery/example.html)



حمل الاداة :

http://i39.tinypic.com/2ppc5ly.jpg (http://www.advphp.com/tuts/js/photogallery/photogallery.rar)

طريقة الأستخدام بسيطه جدا:

فى الصفحة التى تريد اضافة معرض الصور:

اولا بين وسمى head أضف روابط جلب الملفات المطلوبه
رمز PHP:

<code style="white-space:nowrap"> <code> <link href="/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="/jphotogrid.css" rel="stylesheet" type="text/css" media="screen" />
<!--&#91;if IE&#93;>
<link href="/jphotogrid.ie.css" rel="stylesheet" type="text/css" media="screen" />
<!&#91;endif&#93;-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="/jphotogrid.js"></script>
<script src="/jflickrfeed.js"></script>
<script src="/setup.js"></script>
</code> </code>


2- لتقوم بادراج المعرض: استخدم هذا الكود code وبدل روابط الصور باى مقاسات تريدها, فهو يقوم بعمل thumb لها , وأذا أردت ان تكون الصورة بأفضل جوده يفضل عملها كما هو مخصص بالمقاس اللى تم عمل وتنظيم المعرض على أساسه وهو ان تكون الصوره بأبعاد 175 115x
رمز PHP:

<code style="white-space:nowrap"> <code> <div id="container">


<h3 align="center">مثال لمعرض الصور المنبثق </h3>

<ul id="pg">
<li>
<img src="http://farm4.static.flickr.com/3647/3435384001_9ed9864bb4.jpg" alt="DSC_0660">
<p>DSC_0660</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3311/3436188742_caaa28c689.jpg" alt="DSC_0698">
<p>DSC_0698</p>
</li>



<li>
<img src="http://farm4.static.flickr.com/3371/3436188466_418a0d8a06.jpg" alt="DSC_0668">
<p>DSC_0668</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3397/3436188128_5e503cefcd.jpg" alt="DSC_0704">
<p>DSC_0704</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3300/3436187796_4d228a5bde.jpg" alt="DSC_0699">
<p>DSC_0699</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3386/3435382439_68b5e3742b.jpg" alt="DSC_0602">
<p>DSC_0602</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3657/3436187288_e84058f54b.jpg" alt="DSC_0603">
<p>DSC_0603</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3405/3436187010_c731dea9a3.jpg" alt="DSC_0604">
<p>DSC_0604</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3403/3435381659_ea615ecf14.jpg" alt="DSC_0607">
<p>DSC_0607</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3570/3436186474_4e35487600.jpg" alt="DSC_0619">
<p>DSC_0619</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3339/3434101571_30f6f2bffd.jpg" alt="DSC_0620">
<p>DSC_0620</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3134/3434099407_32da82e761.jpg" alt="DSC_0590">
<p>DSC_0590</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3538/3434096369_e2de95b252.jpg" alt="DSC_0562">
<p>DSC_0562</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3348/3434093487_f5a5b8fdb3.jpg" alt="DSC_0544">
<p>DSC_0544</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3652/3434091639_dccdc6342a.jpg" alt="DSC_0541">
<p>DSC_0541</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3537/3434089449_cde6162fa7.jpg" alt="DSC_0532">
<p>DSC_0532</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3385/3434895530_4bf2857b49.jpg" alt="DSC_0531">
<p>DSC_0531</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3411/3434069355_7df0d65490.jpg" alt="Dog dogs">
<p>dogs</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3349/3434870890_3b51171084.jpg" alt="DSC_0693">
<p>DSC_0693</p>
</li>
<li>
<img src="http://farm4.static.flickr.com/3544/3434061033_ba1be12cce.jpg" alt="DSC_0691">
<p>DSC_0691</p>
</li>
</ul>
</div>
</code> </code>


أتمنى تكون الاداة مفيده لكم


بالتوفيق



مع تحيات معهد عرب فى بى
http://www.arabvb.net/vb/index.php







ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)




https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©