[ Code ] حركة جميلة لأرقام الصفحات pagenav [الأرشيف] - معهد بسمة مصرية

FOR SAT

2017-01-03, 02:03 AM

السلام عليكم

خير الكلام ما قل ودل
حركة جميلة و جذابة و سهلة التركيب
صورة قبل التركيب
http://store1.up-00.com/2017-01/1483397993791.png
و بعد التركيب
http://store1.up-00.com/2017-01/1483397993862.png

طريقة التركيب
البحث بالقوالب بالاستايل المراد تطبيق الشرح عليه
ابحث عن ,, pagenav
أستبدل كل محتواه بهذا الكود
<div class="pager_simple_orange">
<table>
<tr>
<td class=""><phrase 1="$pagenumber" 2="$totalpages">$vbphrase[page_x_of_y]</phrase></td>
<td class=""><if condition="$show['first']"><a rel="start" class="smallfont" href="$address$address2<if condition="$anchor">#$anchor</if>" title="$vbphrase[first_page] - <phrase 1="$firstnumbers[first]" 2="$firstnumbers[last]" 3="$total">$vbphrase[results_x_to_y_of_z]</phrase>"><strong>«</strong> $vbphrase[pagenav_first]</a></if></td>
<td class=""><if condition="$show['prev']"><a rel="prev" class="smallfont" href="$address$address2<if condition="$prevpage != 1">&page=$prevpage</if><if condition="$anchor">#$anchor</if>" title="$vbphrase[prev_page] - <phrase 1="$prevnumbers[first]" 2="$prevnumbers[last]" 3="$total">$vbphrase[results_x_to_y_of_z]</phrase>"><</a></if></td>
$pagenav
<td class=""><if condition="$show['next']"><a rel="next" class="smallfont" href="$address$address2&page=$nextpage<if condition="$anchor">#$anchor</if>" title="$vbphrase[next_page] - <phrase 1="$nextnumbers[first]" 2="$nextnumbers[last]" 3="$total">$vbphrase[results_x_to_y_of_z]</phrase>">></a></if></td>
<td class=""><if condition="$show['last']"><a class="smallfont" href="$address$address2&page=$totalpages<if condition="$anchor">#$anchor</if>" title="$vbphrase[last_page] - <phrase 1="$lastnumbers[first]" 2="$lastnumbers[last]" 3="$total">$vbphrase[results_x_to_y_of_z]</phrase>">$vbphrase[pagenav_last] </a></if></td>
</tr>
</table>
</div>

<style>
.pager_simple_orange td{
padding: 1px;
}

.pager_simple_orange a{
text-decoration: none;
font: 12px Arial;
font-weight: normal;
color: black;
display: block;
padding: 5px 10px;
border: 1px solid #fe8c00;
background-color: #ffd9b4;
}

.pager_simple_orange span{
text-decoration: none;
font: 12px Arial;
font-weight: normal;
color: black;
display: block;
padding: 5px 10px;
border: 1px solid black;
background-color: #fe8c00;
}

.pager_simple_orange a:hover{
border: 1px solid black;
background-color: #fe8c00;
}
</style>

طبعا تقدر تتحكم بالأوان والخ...
:Smiley::Smiley:

WRONG WAY

2017-01-03, 10:24 PM

طريقة جيدة ولكن يفضل وضع اكواد الـ CSS فى تعاريف CSS الإضافية/Additional CSS Definitions

FOR SAT

2017-01-04, 01:05 PM

طريقة جيدة ولكن يفضل وضع اكواد الـ CSS فى تعاريف CSS الإضافية/Additional CSS Definitions
صحيح لكن هذا ما استطعت الحصول عليه اخي :ThumbUp: