قرار دادن تولبار در سمت چپ قالب

naser_847 · بهمن 92

سلام

من این ماژول نصب کردم

Flexi Custom Code

حالا می خوام یه کد تولبار در سمت چپ قالبم قرار بدم و وقتی قالب رو اسکرول کردم این تولبار اسکرول نشه

اینم کدش

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="styles.css" />
<style>
*{
/* A universal CSS reset */
margin:0;
padding:0;
}
#navigationMenu li{
list-style:none;
height:39px;
padding:2px;
width:40px;
}
#navigationMenu span{
/* Container properties */
width:0;
left:38px;
padding:0;
position:absolute;
overflow:hidden;
/* Text properties */
font-family:'Myriad Pro',Arial, Helvetica, sans-serif;
font-size:18px;
font-weight:bold;
letter-spacing:0.6px;
white-space:nowrap;
line-height:39px;
/* CSS3 Transition: */
-webkit-transition: 0.25s;
/* Future proofing (these do not work yet): */
-moz-transition: 0.25s;
transition: 0.25s;
}
#navigationMenu a{
background:url('') no-repeat;
height:39px;
width:38px;
display:block;
position:relative;
}
/* General hover styles */
#navigationMenu a:hover span{ width:auto; padding:0 20px;overflow:visible; }
#navigationMenu a:hover{
text-decoration:none;
/* CSS outer glow with the box-shadow property */
-moz-box-shadow:0 0 5px #9ddff5;
-webkit-box-shadow:0 0 5px #9ddff5;
box-shadow:0 0 5px #9ddff5;
}
/* Green Button */
#navigationMenu .home { background-position:0 0;}
#navigationMenu .home:hover { background-position:0 -39px;}
#navigationMenu .home span{
background-color:#7da315;
color:#3d4f0c;
text-shadow:1px 1px 0 #99bf31;
}
/* Blue Button */
#navigationMenu .about { background-position:-38px 0;}
#navigationMenu .about:hover { background-position:-38px -39px;}
#navigationMenu .about span{
background-color:#1e8bb4;
color:#223a44;
text-shadow:1px 1px 0 #44a8d0;
}
/* Orange Button */
#navigationMenu .services { background-position:-76px 0;}
#navigationMenu .services:hover { background-position:-76px -39px;}
#navigationMenu .services span{
background-color:#c86c1f;
color:#5a3517;
text-shadow:1px 1px 0 #d28344;
}
/* Yellow Button */
#navigationMenu .portfolio { background-position:-114px 0;}
#navigationMenu .portfolio:hover{ background-position:-114px -39px;}
#navigationMenu .portfolio span{
background-color:#d0a525;
color:#604e18;
text-shadow:1px 1px 0 #d8b54b;
}
/* Purple Button */
#navigationMenu .contact { background-position:-152px 0;}
#navigationMenu .contact:hover { background-position:-152px -39px;}
#navigationMenu .contact span{
background-color:#af1e83;
color:#460f35;
text-shadow:1px 1px 0 #d244a6;
}
/* The styles below are only needed for the demo page */
#main{
margin:80px auto;
position:relative;
width:40px;
}
h1{
color:#fff;
font-size:30px;
font-weight:normal;
padding:60px 0 20px;
text-align:center;
}
h2{
font-weight:normal;
text-align:center;
}
h1,h2{
font-family:"Myriad Pro",Arial,Helvetica,sans-serif;
}
a, a:visited,a:active {
color:#0196e3;
text-decoration:none;
outline:none;
}
a:hover{
text-decoration:underline;
}
a img{
border:none;
}
p.note{
color:#707070;
font-size:10px;
text-align:center;
margin:50px;
}
</style>
</head>
<body>
<div id="main">
<ul id="navigationMenu">
<li>
<a class="home" href="#">
<span>خانه</span>
</a>
</li>
<li>
<a class="about" href="#">
<span>About</span>
</a>
</li>
<li>
<a class="services" href="#">
<span>Services</span>
</a>
</li>
<li>
<a class="portfolio" href="#">
<span>Portfolio</span>
</a>
</li>
<li>
<a class="contact" href="#">
<span>Contact us</span>
</a>
</li>
</ul>
</div>
</body>
</html>

حالا چطوری می تونم این تولبار رو به سمت چپ ببرم و طوری ثابتش کنم که موقع اسکرول قالب ثابت بمونه؟

مصطفی صفرعلی · بهمن 92

با سلام

برای اینکار باید یه موقعیت ایجاد کنید و با استفاده از css جایگاه اون رو در قالبتون ثابت کنید . باید از خاصیت position: fixed برای موقعیت تون استفاده کنید

بعد میتونید تو اون موقعیت با استفاده از ماژول html دستی کدتون رو وارد کنید

البته کد رو به این شکل نمیتونید اضافه کنید . فقط میتونید محتوای تگ بادی رو داخل ماژول اضافه کنید و استایلها رو هم به یکی از فایلهای css قالبتون اضافه کنید

موفق و پیروز باشید

یا حق

ورود

آخرین ارسال های انجمن جومینا

دانلود جوملای فارسی

دانلود افزونه ها

پیامک متصل به جوملا

کانال تلگرام جومینا

قرار دادن تولبار در سمت چپ قالب

پست های پیشنهاد شده

naser_847 0

به اشتراک گذاری این ارسال

لینک به ارسال

به اشتراک گذاری در سایت های دیگر

مصطفی صفرعلی 2,891

به اشتراک گذاری این ارسال

لینک به ارسال

به اشتراک گذاری در سایت های دیگر

به گفتگو بپیوندید

فهرست

فعالیت ها