زمان جاری : سه شنبه 30 شهریور 1400 - 10:34 قبل از ظهر
نام کاربری : پسورد : یا عضویت | رمز عبور را فراموش کردم




تابلو اعلانات
elanat

ارسال پاسخ
تعداد بازدید 417
نویسنده پیام
distoper آفلاین


ارسال‌ها : 23
عضویت: 12 /4 /1394
محل زندگی: Kermanshahan
سن: 21
شناسه یاهو: farscloob
تشکرها : 3
تشکر شده : 7
منو جالب در طراحی سایت با کد JavaScript



کد CSS خام:
کد:
<style>

#sse1
{
/*You can decorate the menu's container, such as adding background images through this block*/
background-color: #222;
height: 38px;
padding: 15px;
border-radius: 3px;
box-sizing: content-box;
}
#sses1

{


margin:0 auto;/*This will make the menu center-aligned. Removing this line will make the menu align left.*/


}


#sses1 ul


{


position: relative;


list-style-type: none;


float:left;


padding:0;margin:0;


border-bottom:solid 1px #6C0000;


}


#sses1 li


{


float:left;


list-style-type: none;


padding:0;margin:0;background-image:none;


}


/*CSS for background bubble*/


#sses1 li.highlight


{


background-color:#800;


top:36px;


height:2px;


border-bottom:solid 1px #C00;


z-index: 1;


position: absolute;


overflow:hidden;


}


#sses1 li a


{


box-sizing: content-box;


height:30px;


padding-top: 8px;


margin: 0 20px;/*used to adjust the distance between each menu item. Now the distance is 20+20=40px.*/


color: #fff;


font: normal 12px arial;


text-align: center;


text-decoration: none;


float: left;


display: block;


position: relative;


z-index: 2;


}
</style>


کد JavaScript خام:
کد:

<script>
var sse1 = function () {
var rebound = 20; //set it to 0 if rebound effect is not prefered
var slip, k;
return {
buildMenu: function () {
var m = document.getElementById('sses1');
if(!m) return;
var ul = m.getElementsByTagName("ul")[0];
m.style.width = ul.offsetWidth+1+"px";
var items = m.getElementsByTagName("li");
var a = m.getElementsByTagName("a");


slip = document.createElement("li");
slip.className = "highlight";
ul.appendChild(slip);


var url = document.location.href.toLowerCase();
k = -1;
var nLength = -1;
for (var i = 0; i < a.length; i++) {
if (url.indexOf(a.href.toLowerCase()) != -1 && a.href.length > nLength) {
k = i;
nLength = a.href.length;
}
}


if (k == -1 && /:\/\/(?:www\.)?[^.\/]+?\.[^.\/]+\/?$/.test) {
for (var i = 0; i < a.length; i++) {
if (a.getAttribute("maptopuredomain") == "true") {
k = i;
break;
}
}
if (k == -1 && a[0].getAttribute("maptopuredomain") != "false")
k = 0;
}


if (k > -1) {
slip.style.width = items[k].offsetWidth + "px";
//slip.style.left = items[k].offsetLeft + "px";
sse1.move(items[k]); //comment out this line and uncomment the line above to disable initial animation
}
else {
slip.style.visibility = "hidden";
}


for (var i = 0; i < items.length - 1; i++) {
items.on-mouseover = function () {
if (k == -1) slip.style.visibility = "visible";
if (this.offsetLeft != slip.offsetLeft) {
sse1.move(this);
}
}
}


m.on-mouseover = function () {
if (slip.t2)
slip.t2 = clearTimeout(slip.t2);
};


m.on-mouseout = function () {
if (k > -1 && items[k].offsetLeft != slip.offsetLeft) {
slip.t2 = setTimeout(function () { sse1.move(items[k]); }, 50);
}
if (k == -1) slip.t2 = setTimeout(function () { slip.style.visibility = "hidden"; }, 50);
};
},
move: function (target) {
clearInterval(slip.timer);
var direction = (slip.offsetLeft < target.offsetLeft) ? 1 : -1;
slip.timer = setInterval(function () { sse1.mv(target, direction); }, 15);
},
mv: function (target, direction) {
if (direction == 1) {
if (slip.offsetLeft - rebound < target.offsetLeft)
this.changePosition(target, 1);
else {
clearInterval(slip.timer);
slip.timer = setInterval(function () {
sse1.recoil(target, 1);
}, 15);
}
}
else {
if (slip.offsetLeft + rebound > target.offsetLeft)
this.changePosition(target, -1);
else {
clearInterval(slip.timer);
slip.timer = setInterval(function () {
sse1.recoil(target, -1);
}, 15);
}
}
this.changeWidth(target);
},
recoil: function (target, direction) {
if (direction == -1) {
if (slip.offsetLeft > target.offsetLeft) {
slip.style.left = target.offsetLeft + "px";
clearInterval(slip.timer);
}
else slip.style.left = slip.offsetLeft + 2 + "px";
}
else {
if (slip.offsetLeft < target.offsetLeft) {
slip.style.left = target.offsetLeft + "px";
clearInterval(slip.timer);
}
else slip.style.left = slip.offsetLeft - 2 + "px";
}
},
changePosition: function (target, direction) {
if (direction == 1) {
//following +1 will fix the IE8 bug of x+1=x, we force it to x+2
slip.style.left = slip.offsetLeft + Math.ceil(Math.abs(target.offsetLeft - slip.offsetLeft + rebound) / 10) + 1 + "px";
}
else {
//following -1 will fix the Opera bug of x-1=x, we force it to x-2
slip.style.left = slip.offsetLeft - Math.ceil(Math.abs(slip.offsetLeft - target.offsetLeft + rebound) / 10) - 1 + "px";
}
},
changeWidth: function (target) {
if (slip.offsetWidth != target.offsetWidth) {
var diff = slip.offsetWidth - target.offsetWidth;
if (Math.abs(diff) < 4) slip.style.width = target.offsetWidth + "px";
else slip.style.width = slip.offsetWidth - Math.round(diff / 3) + "px";
}
}
};
} ();


if (window.addEventListener) {
window.addEventListener("load", sse1.buildMenu, false);
}
else if (window.attachEvent) {
window.attachEvent("onload", sse1.buildMenu);
}
else {
window["onload"] = sse1.buildMenu;
}

</script>


کد اصلی در (Body) قرار داده شود:
کد:
<div id="sse1">
<div id="sses1">
<ul>
<li><a href="http://farscloob.ir/">Javascript Menus</a></li>
<li><a href="http://farscloob.ir/">Horizontal Menus</a></li>
<li><a href="http://farscloob.ir/">Web Menus</a></li>
</ul>
</div>
</div>



امیدوارم خوشتون اومده باشه.... یاعلی

امضای کاربر :


همیشه حرفی را بزن که بتوانی بنویسی..

چیزی را بنویس که بتوانی امضایش کنی و چیزی را امضاء کن که بتوانی پایش باستی




پنجشنبه 01 مرداد 1394 - 04:09
نقل قول این ارسال در پاسخ گزارش این ارسال به یک مدیر
تشکر شده: 2 کاربر از distoper به خاطر این مطلب مفید تشکر کرده اند: 98love & koolak91 &
mhadides آفلاین



ارسال‌ها : 98
عضویت: 22 /8 /1393
شناسه یاهو: mahdi_tarh
تشکرها : 252
تشکر شده : 18
پاسخ : 1 RE منو جالب در طراحی سایت با کد JavaScript
فرقش با منوهای دیگه در چیه که با جاوااسکریپته؟؟من که تغییری احسای نمیکنم!کار خاصی انجام میده؟؟

امضای کاربر :


پنجشنبه 01 مرداد 1394 - 11:46
نقل قول این ارسال در پاسخ گزارش این ارسال به یک مدیر
98love آفلاین



ارسال‌ها : 2396
عضویت: 25 /8 /1391
محل زندگی: یزد
تشکرها : 995
تشکر شده : 1557
پاسخ : 2 RE منو جالب در طراحی سایت با کد JavaScript
آفرین. خوبه

دامین سایتتم برا شبکه اجتماعی عالیه..

امضای کاربر : در لباس آبی از من بیشتر دل می بری
آسمان وقتی که می پوشی کبوتر می شوم....


پنجشنبه 01 مرداد 1394 - 11:48
نقل قول این ارسال در پاسخ گزارش این ارسال به یک مدیر
koolak91 آفلاین



ارسال‌ها : 1750
عضویت: 27 /9 /1391
محل زندگی: زمین خدا
شناسه یاهو: ali.yazdani1666
تشکرها : 541
تشکر شده : 683
پاسخ : 3 RE منو جالب در طراحی سایت با کد JavaScript
قشنگه ولی میتونی بهش استایل هم بدی که موس رفت روش تغییر حالت بده تا زیباتر هم بشه
پیروز باشید./
یاعلی

امضای کاربر :
السلام علیک یا ابا عبدالله الحسین(علیه السلام)
دلم... یک اتفاق تازه می خواهد..!!
نه مثل عشق و دل دادن..؛
نه در دام غم افتادن..؛
دگر اینها گذشت از ما..!
شبیه شوق یک کودک..
که کفش نو به پا دارد
و گویی کل دنیا را..
در آن لحظه به زیر کفشها دارد،
دلم یک شور بی اندازه می خواهد!
فقط گاهی...
دلم ... یک اتفاق تازه می خواهد..!!



(نوشته های خودتون رو در کولاک91 به نمایش بگذارید)
وبسایت شخصی من
پنجشنبه 01 مرداد 1394 - 12:17
نقل قول این ارسال در پاسخ گزارش این ارسال به یک مدیر
20-abzar آفلاین



ارسال‌ها : 1141
عضویت: 22 /8 /1393
محل زندگی: gorgan
سن: 23
شناسه یاهو: تلگرام @seyed_admin
تشکرها : 203
تشکر شده : 243
پاسخ : 4 RE منو جالب در طراحی سایت با کد JavaScript
نقل قول از mhadides
فرقش با منوهای دیگه در چیه که با جاوااسکریپته؟؟من که تغییری احسای نمیکنم!کار خاصی انجام میده؟؟
تنها تغییرش اینه ک با جاوا اسکریپته
من تا الان بیشتر منو ها ک دیدم با سی اس اس بود

//
استایل هم بهش بده تا یکمی گرافیکی تر و جذاب تر بشه
با تشکر


امضای کاربر :
....بیست ابزار....



عاشقانه


. ⇢⇣⇠ اِی روزِگــــــار ⇢⇣⇠


یِکیـــو خوشگِــــل کَــردی●


یِکیـــو پــولـــــدار کَــردی●


یِکیـــو مَشهــــــور کَــردی ●


دَمِــت گَــــرم ➽


مــا رو ↜فَقَــــط↝ کَــــردے♚☞
پنجشنبه 01 مرداد 1394 - 12:20
نقل قول این ارسال در پاسخ گزارش این ارسال به یک مدیر
saranaz آفلاین



ارسال‌ها : 124
عضویت: 22 /12 /1396
تعداد اخطار: 99
تشکرها : 1

پاسخ : 5 RE منو جالب در طراحی سایت با کد JavaScript
بازرگانی معینی در نظر دارد به مناسبت فرارسیدن عید نوروز تخفیف عیدانه از 5 درصد تا 30 درصد در محصولات ذیل به مشتریان عزیز اهدا نماید.
فروش ویژه تجهیزات آشپزخانه شامل یراق آلات (بلوم)-اکسسوری- هود -فر- اجاق گاز- ماکروفر- ماکروویو-کشو گرم کنبخارپزسینک استیلسینک گرانیتیتجهیزات ریلی کابینت آشپزخانه وکشو سوپری... از برند های بلوم اتریش – ملونیهایگلد- روبرتوزیگمابوش- آریستونتکنو – اسنوا – استیل البرز
شماره های تماس: 09133127025 – 03136641103- 03136641104- 03136629450- 03136629447 و شماره
شماره و کانال تلگرام 09130195520 t.me/bazarganimoeinie-
سایت: https://digimoeini.com/
اینستاگرام: bazarganimoeinie
آدرس:اصفهان خیابان فیض جنب بانک صادرات بازرگانی معینی
فروش ویژه 5تا30 درصد تخفیف عیدانه
انگشت مبارکتان را روی لینک زیر بزنید و از تمام قیمت های یراق آلات و اکسسوری باخبر شوید.

چهارشنبه 23 اسفند 1396 - 16:40
نقل قول این ارسال در پاسخ گزارش این ارسال به یک مدیر
ارسال پاسخ



برای ارسال پاسخ ابتدا باید لوگین یا ثبت نام کنید.


پرش به انجمن :