fixed footer-bar فووتر بار ثابت يحتوي مميزات لا تتخيلها وبشكل رائع جدا مع ايقونة اظهار واخفاء حصريا على موقع جنتل الاردن

موقع جنتل الاردن هو عبارة عن فكرة بسيطة جدا مواضيع نطرحها نؤلف نترجم ونقتبس كل ذلك سبيلا في خدمة القارئ العربي
 
الرئيسيةس .و .جمكتبة الصوربحـثالتسجيلدخول

fixed footer-bar فووتر بار ثابت يحتوي مميزات لا تتخيلها وبشكل رائع جدا مع ايقونة اظهار واخفاء حصريا على موقع جنتل الاردن

الموضوع السابق الموضوع التاليمركز رفع الصور
Posted By

Moh'd S Hammoudeh


انشرالموضوع
الرد عن طريق الفيس بوك
الابلاغ عن الموضوع




مواقع صديقة
All Tricks And Tips
Entertainment
أضف موقعك هنا
أضف موقعك هنا


صفحات فيسبوكية رائعة
All Tricks And Tips
Entertainment
المحاسبين
موقع جنتل الاردن
أضف صفحتك هنا
أضف صفحتك هنا


صفحتنا الرسمية على الفيس بوك

صفحتنا الرسمية على تويتر



الإثنين مارس 11, 2013 1:19 am ساندنا على الفيس بوك  ساندنا على اليوتيوب ساندنا على تويـــــــتر









فووتر بار ثابت يحتوي مميزات لا تتخيلها وبشكل رائع جدا مع ايقونة اظهار واخفاء حصريا على موقع جنتل الاردن




لمشاهدة مثال من هنا

http://www.algantel.com/h106-page


اولا تركيب الكود في المدونات :

1.) اذهب الى blogger
2) افتح مدونتك التي ترغب ان تضيف لها الكود .
3) اذهب إلى انسيق.
4) انقر على "إضافة أداة" حيث تريد إضافتا
5) انتقل الآن إلى <"HTML-JAVASCRIPT">
6) انقر على "+" رمز لإضافته.
7) الآن انسخ الرمز أدناه والصقه إلى هناك. أترك عنوان فارغ.
9 انقر فوق.) حفظ،



ثانيا: تركيب الكود في المواقع :

- اولا افتح الجزء الخاص بال html
- انسخ الكود التالي والصقه في جزء ال body
- احفظ السابق


الرمز:


<!-- Algantel.com -->

<style type="text/css">

#exefixedfootermain {width:100%; height:100px; position:fixed; bottom:0%; left:0%;}
 #exefixedfooterdiv {border-top: 3px solid #a0a0a0; background-image: url(http://i69.servimg.com/u/f69/14/82/58/44/210.png); overflow:none; width:100%; height:100px; position:fixed; bottom:0%; left:0%;}
#exefixedfooterhide{position: absolute;bottom: 100px;right: 5px;width: 30px;height: 25px;cursor:pointer;background-image: url(http://i69.servimg.com/u/f69/14/82/58/44/210.png);padding-top:5px;border-top: 3px solid #a0a09e; border-left: 3px solid #a0a09e; border-right: 3px solid #a0a09e; border-top-right-radius:5px;border-top-left-radius:5px;}
 #exefixedfootershow{position: absolute;bottom: 0px;right: 5px;width: 30px;height: 25px;cursor:pointer;background-image: url(http://i69.servimg.com/u/f69/14/82/58/44/210.pngg);padding-top:5px;border-top: 3px solid #a0a09e; border-left: 3px solid #a0a09e; border-right: 3px solid #a0a09e; border-top-right-radius:5px;border-top-left-radius:5px;}
.exefixedfooterdownarrow {width: 0; height: 0; border-left: 10px solid transparent;border-right: 10px solid transparent; border-top: 10px solid #eeff00;}
.exefixedfooteruparrow {width: 0; height: 0; border-left: 10px solid transparent;border-right: 10px solid transparent; border-bottom: 10px solid #eeff00;}
.exefixedfooterblockarrow {width: 8px; height: 10px; background-color: #eeff00;}
#exefixedfootersocial {position: absolute;bottom: 70px;right: 5px;width: 280px;height: 30px;float: right;}
#exefixedfootersocialicon {position: absolute;bottom: -20px;right: 5px;width: 290px;height: 64px;float: right;}
#exefixedfootersocialicon img{border: 0px;float: left;-webkit-transition: margin 0.2s ease-out;-moz-transition: margin 0.2s ease-out;-o-transition: margin 0.2s ease-out;}
#exefixedfootersocialicon img:hover {margin-top:-10px;transform: rotate(-25deg);-webkit-transform: rotate(-25deg);-moz-transform: rotate(-25deg);transition: transform 0.2s ease-out;-webkit-transition: -webkit-transform 0.2s ease-out;-moz-transition: -moz-transform 0.2s ease-out;}
#exefixedfooteremailsubscribe {position: absolute;top: 10px;left: 420px;width: 242px;height: 90px;}
.exefixedfooteremailsubscribebox input.email{padding: 7px 10px 7px 10px;font-family: "Arial","Helvetica",sans-serif;width: 218px; font-size: 12px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.exefixedfooteremailsubscribebox input.subscribe{background-color: #FFCA00;padding:7px 28px;margin-left:0px;font-weight:bold;font-size:12px;cursor:pointer;font-family: "Arial","Helvetica",sans-serif;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;
background: #f1e767; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YxZTc2NyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZWI2NDUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #f1e767 0%, #feb645 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f1e767), color-stop(100%,#feb645)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #f1e767 0%,#feb645 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #f1e767 0%,#feb645 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #f1e767 0%,#feb645 100%); /* IE10+ */
background: linear-gradient(to bottom, #f1e767 0%,#feb645 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645',GradientType=0 ); /* IE6-8 */
}
.exefixedfooteremailsubscribebox input.subscribe:hover{background-color: #eeff00;
background: #feb645; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlYjY0NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmMWU3NjciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #feb645 0%, #f1e767 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#feb645), color-stop(100%,#f1e767)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #feb645 0%,#f1e767 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #feb645 0%,#f1e767 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #feb645 0%,#f1e767 100%); /* IE10+ */
background: linear-gradient(to bottom, #feb645 0%,#f1e767 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feb645', endColorstr='#f1e767',GradientType=0 ); /* IE6-8 */
}
</style>
<!--[if IE]>
<style>
.exefixedfooteremailsubscribebox input.subscribe{width:243px;}
</style>
<![endif]-->
<!--[if gte IE 9]>
<style type="text/css">
.gradient {filter: none;}
</style>
<![endif]-->
<div id="exefixedfootermain" >
<center id="exefixedfootershow" onmouseup="document.getElementById('exefixedfooterdiv').style.display='block'"><div class="exefixedfooteruparrow"></div><div class="exefixedfooterblockarrow"></div></center>
<div id="exefixedfooterdiv" >
<center id="exefixedfooterhide" onmouseup="document.getElementById('exefixedfooterdiv').style.display='none'"><div class="exefixedfooterblockarrow"></div><div class="exefixedfooterdownarrow"></div></center>
<img src="http://i69.servimg.com/u/f69/14/82/58/44/1118.png" height="100px" width="420px" title="Subscribe Our E-Mails And Get Our Next Hottest Article Directile Into Your Inbox." alt="EXE-Fixed Footer"/>
<div id="exefixedfooteremailsubscribe">
<div class="exefixedfooteremailsubscribebox">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=AlgantelOfJordan', 'popupwindow', 'scrollbars=yes,width=600,height=600');return true">
<input class="email" type="text" id="email" name="email" value="Enter Your Email Here.." onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" />
<input type="hidden" value="AlgantelOfJordan" name="uri" />
<input type="hidden" name="loc" value="en_US" /><br />
<input class="subscribe" name="commit" type="submit" value="Subscribe Our News Letter Now" />
</form>
</div>
<center style="color:#fff; font-size:10px; ">E-Mail Will Be Delivered By FeedBurner.</center>
</div>
<div id="exefixedfootersocial">
<center style="color:#eeff00;font-size:36px;font-style:italic;">Find Us On...!!!</center>
</div>
<div id="exefixedfootersocialicon">
<a href="https://www.facebook.com/algantel_site"><img src="https://lh6.googleusercontent.com/-NGikSRqIb04/T_ptQCXD3fI/AAAAAAAACmk/r_kstXxsfpw/s48/exe-facebook.png" height="48px" width="48px" title="Like Us On Facebook" alt="Image"></a>
<a href="https://twitter.com/algantel_site"><img src="https://lh6.googleusercontent.com/-r-IyrkrRhj4/T_ptRgJFjWI/AAAAAAAACnA/yhIG0T4QbKo/s48/exe-twitter.png" height="48px" width="48px" title="Follow Me On Twitter" alt="Image"></a>
<a href="https://plus.google.com/u/0/104892053764644477935"><img src="https://lh3.googleusercontent.com/-0TVIOKq_C4E/T_ptQxphQxI/AAAAAAAACmw/XnTSdn-4wuo/s48/exe-google.png" height="48px" width="48px" title="Add Us To Your Circle" alt="Image"></a>
<a href="https://www.youtube.com/user/2algentel1"><img src="https://lh6.googleusercontent.com/-4VvmB4qGdWs/T_ptSXReS3I/AAAAAAAACnU/SCi27wjtdTM/s48/exe-youtube.png" height="48px" width="48px" title="Subscribe Us On YouTube" alt="Image"></a>
<a href="http://www.linkedin.com/profile/view?id=233219391"><img src="https://lh5.googleusercontent.com/-PmTaKcSHu_8/T_ptRD6WbLI/AAAAAAAACm8/xL_1mQTeJk8/s48/exe-linkedin.png" height="48px" width="48px" title="Join Me On LinkedIn" alt="Image"></a>
<a href="http://feeds.feedburner.com/AlgantelForEver"><img src="https://lh3.googleusercontent.com/-U4auSg9SWMk/T_ptRXrPdtI/AAAAAAAACm4/W_jd15SnB1s/s48/exe-rss.png" height="48px" width="48px" title="Subscribe Our RSS" alt="Image"></a>
</div>
</div>
</div>
<!-- Algantel.com -->

قم بتغيير الاتي :

- ابحث عن "AlgantelOfJordan" ,وقم بتغييرها الى اسم حسابك على feed-burner
- قم بتغيير الاتي الى رابط صفحتك على الفيس بوك "https://www.facebook.com/algantel_site"
- قم بتغيير الاتي الى رابط صفحتك على تويتر "https://twitter.com/algantel_site"
- قم بتغيير الاتي الى رابط صفحتك على جوجل بلس "https://plus.google.com/u/0/104892053764644477935"
- قم بتغيير الاتي الى رابط صفحتك على يوتيوب "https://www.youtube.com/user/2algentel1"
- "http://www.linkedin.com/profile/view?id=233219391"
- قم بتغيير الاتي الى رابط صفحتك الخاص ب rss طبعا فقط الرابط "http://feeds.feedburner.com/AlgantelForEver"











جميع المواضيع و الردود تعبر عن رأي صاحبها ولا تعبر عن رأي إداره موقع جنتل الاردن بــتــاتــآ
الرجوع الى أعلى الصفحة اذهب الى الأسفل
 

الموضوع السابق الموضوع التالي
صفحة 1 من اصل 1








جميع الحقوق محفوظة لبوابة جنتل الاردن © 2013