karaneha

سوالی برای ایجا یک ستون خاص

14 پست در این موضوع قرار دارد

با سلام خدمت همه ی دوستان و اساتید ارجمند

دوستان عزیز کمک کنید تا من بتونم حداقل جواب این سوالم رو در این سال91 بگیرم و منم یه خاطره ی خوب از این انجمن داشته باشم... !!!؟؟؟

لطفن یه جوری راهنمایی کنید که می خواید یه بچه دبستانی رو الفبا یاد بدید!!! حالا که دیگه تعطیلید دوستان.

من می خوام یه ستون با ارتفاع کم و عرض مناسب و با 4 تب متفاوت برای سایتم قرار بدم، مثل ستون سمت چپ سایت زیر که دقیقا به همون شکل باشه و فقط تیتر عناوین و موضوعات داخلیش متفاوت باشه.

http://www.airport.ir/SitePages/Home.aspx ---- ستون سمت چپ و زیر "مناسبت ها"، نوشته: "فرودگاههای تحت نظارت و ..."

من تا حالا فقط تونستم ستونش رو با عرض و ارتفاع دلخواهم درست کنم، ولی توی بقیه ی مراحل اجراش موندم. میخوام دققا مثل همون ستون باشه مثلا وقتی میریم روی "پرتال های ستادی" زیر دسته هاش باز بشن و ... .

لطفن اگه باید فایل php یا ... جدیدی در قالب سایت اضافه کنم، یا باید تغییری در style.css بدم یا افزونه ای نصب بشه، یا ...، قدم به قدم بفرمایید، فکر می کنم یه آموزش خیلی خوبم واسه ی سایر افراد انجمن باشه که میخوان همچین ستونهایی داشته باشن.

پیشاپیش از کمکتون ممنونم و عیدتونم مبارک.

0

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


لینک به پست

دوستان من قبلن مثل این سوال رو مطرح کردم ولی جواب درستی نگرفتم. اگه میشه لطفن یه راه ساده تر بگید! :(

0

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


لینک به پست

شما اول باید بتونید سئوالتون را درست بپرسید تا واب درست بگیرید تا جایی که من فهمیدم چیزی که الان شما نیاز دارید استایل بندی و کدهای css هستش و ربطی به ستون کناری و مباحثی که در وردپرس داره نداره

ستون سمت چپ این سایت ترکیب js و css3 هست

اول کدهایی که می دم را در روی نوت پد بریزید و با پسوند html ذخیره کنید روی سیستمتون و با استفاده از نمایشگر اینترنت بازش کنید ببینید هر وقت دلخواهتون بود اون ها را به php تبدیل می کنیم و به سایتتون منتقل می کنیم


<style type="text/css">
#sidebar-new {
position:relative;
display:block;
height:270px;
width:240px;
margin:auto;
padding:0;
}
#sidebar-new div {
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
margin:0;
padding:5px;
overflow:hidden;
display:block;
}
#sidebar-new .new-w {
height:30px;
}
#sidebar-new .open {
height:180px;
}
#sidebar-new h3 {
line-height:30px;
text-align:center;
font-size:12px;
}
#w1 {
background:#CC9900
}
#w2 {
background:#99CC00
}
#w3 {
background:#FF0000
}
#w4 {
background:#3366FF
}
</style>
<script>
function newsidebar(Down)
{
document.getElementById('w1').className='new-w';
document.getElementById('w2').className='new-w';
document.getElementById('w3').className='new-w';
document.getElementById('w4').className='new-w';
document.getElementById(Down).className='open';
}
</script>
<div id="sidebar-new">
<div id="w1" class="open">
<h3 onclick="newsidebar('w1')">عنوان </h3>
</div>
<div id="w2" class="new-w">
<h3 onclick="newsidebar('w2')">عنوان </h3>
</div>
<div id="w3" class="new-w">
<h3 onclick="newsidebar('w3')">عنوان </h3>
</div>
<div id="w4" class="new-w">
<h3 onclick="newsidebar('w4')">عنوان </h3>
</div>
</div>

3

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


لینک به پست

خیلی ممنون از پاسخ مناسبتون. آره سوالم رو درست متوجه شدید. (قبلن این سوال رو به یه شیوه ی دیگه مطرح کرده بودم که متاسفانه جوابهای نامربوطی گرفتم. ممنون از شما.)

فقط این ستون سایر عناوینش هم حرکت میکنند؟ یعنی وقتی با موس میرم روی عنوانهای دیگه بالا نمیان برای نمایش محتویاتشون!؟؟ چون واسه من که فقط عنوان زردرنگ نمایش داده میشه.

حالا باید چیکار کرد در قدم دوم جناب استاد گرامی؟

0

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


لینک به پست

این نمونه با کلید بر روی نام عناوین باز می شه البته اینکه با اشاره موس باز بشه راحت تره و دیگه به js هم نیاز نداره و می شه با خاصیت hover در css تنظیمش کرد موارد دیگه رو هم ببینیدتا کدش رو برای وردپرس براتون آماده کنم

2

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


لینک به پست

ارسال شده در (ویرایش شده)

متوجه شدم. باید کلیک کنیم تا عنوانهای بعدیش نمایش داده بشن!(البته فقط واسه فایرفاکس کار کرد.)

ویرایش شده در توسط karaneha
0

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


لینک به پست

سلام

سال نو مبارک

کدهای استایل بندی سری سه کلا روی اینترنت اکسپلور ورژن 7 و 8 به پایین کار نمی کنند و این یک مطلب عمومی است ولی باقی ویرایشگر ها پشتیبانی می کنند

البته می شه از جی کوئری هم استفاده کرد اگر عمری بود تا شب چند نمونه معرفی می کنم

فقط من هنوز نمی دونم داخل این منوها را چگونه می خواهید پر کنید این مسئله توی کد نویسی از اون لحاظ مهمه که بدونم اندازه ارتفاع هر فریم همیشه ثابته و یا ممکنه متغیر باشه و اینکه منبع تغذیه شون قرار با دستکاری کدها در هر سری تغییر کنه یا ابزارک مشخصی براشون می سازید اگر این اطلاعات را بدید یک کاریش می کنیم

3

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


لینک به پست

سلام

سال نو شما و سایر دوستان انجمن نیز مبارک باد.

من داخل یکی از اونها قراره "پیوندهای سایتم" رو قرار بدم،دقیقا مثل همون سایتی که معرفی کردم. داخل یکیشون قراره یه کد html پخش موزیک بذارم، داخل سومیش باز هم یک کد html یا یک عکس قرار بدم، و داخل آخریش قسمت ابتدایی یک برگه از برگه های سایتم( مثلا درباره ی ما، که داخلش پر از عکسه) رو قرار بدم( که واسه ی خوندن برگه ی کامل روی اون کلیک کنیم و به صفحه ی مورد نظر منتقل بشیم.).

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

0

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


لینک به پست

مثلا اینجا:

http://css-tricks.com/snippets/jquery/simple-jquery-accordion/

لیست :

http://www.1stwebdesigner.com/freebies/jquery-accordion-menus-tutorials/

2

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


لینک به پست

سلام . خیلی ممنون از لینکهای خوبی که معرفی کردید آقا مرتضی.

فقط 2 تا سوال: فرض کنید من میخوام از لینک اولی که معرفی فرمودید استفاده کنم.

1- من داخل قالبم اصلا فایل جی کوئری ندارم، این قسمت دستورات جی کوئری رو کجا بریزم، اگه لازمه فایلی با پسوند js داخل تم سایتم آپلود کنم لطفا اسم دقیقش رو بفرمایید. چون دستورات css رو که میریزم داخل فایل style.css دستورات html اش رو هم میریزم داخل فایل php ای که مورد نظرمه، ولی واسه ی جی کوئری هاش نمیدونم چیکار کنم؟؟؟؟؟؟؟؟؟؟

2- این دستورات html رو بدون هیچ تغییری بریزم داخل php مشکلی نداره؟

یا لطفن مثلن طرز استفاده از کدهای سایت زیر رو واسم توضیح بدین من که هر کاری کردم نتونستم: :( :(

http://roshanbh.com.np/2008/06/accordion-menu-using-jquery.html

ویرایش شده در توسط karaneha
0

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


لینک به پست

اگه همون فایل html ای رو که آقای فخار در ابتدای بحث گذاشتن رو ادامش رو توضیح بدن،(بریم قدم بعدی) فکر میکنم بهتر باشه.!!!!

0

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


لینک به پست

این سری کدها را در فایل style.css ذخیره کنید


#sidebar-new {
position:relative;
display:block;
height:270px;
width:240px;
margin:auto;
padding:0;
}
#sidebar-new div {
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
margin:0;
padding:5px;
overflow:hidden;
display:block;
}
#sidebar-new .new-w {
height:30px;
}
#sidebar-new .open {
height:180px;
}
#sidebar-new h3 {
line-height:30px;
text-align:center;
font-size:12px;
}

اگر می خواهید به پس زمینه ها رگ هم بدهید این کدها را با رنگ های دلخواه اصلاح کنید و در ادامه کدهای قبل بگذارید


#w1 {
background:#CC9900
}
#w2 {
background:#99CC00
}
#w3 {
background:#FF0000
}
#w4 {
background:#3366FF
}

این کدها را در فایل header.php و قبل از بسته شدن تگ head


<script>
function newsidebar(Down)
{
document.getElementById('w1').className='new-w';
document.getElementById('w2').className='new-w';
document.getElementById('w3').className='new-w';
document.getElementById('w4').className='new-w';
document.getElementById(Down).className='open';
}
</script>

این کدها را در محلی که می خواهید منو نمایش داده شود


<div id="sidebar-new">
<div id="w1" class="open" onmouseover="newsidebar('w1')">
<h3>پیوندها </h3>
<ul><?php wp_list_bookmarks(); ?></ul>
</div>
<div id="w2" class="new-w" onmouseover="newsidebar('w2')">
<h3>موزیک </h3>
<!-- کد html موزیک -->
</div>
<div id="w3" class="new-w" onmouseover="newsidebar('w3')">
<h3>سوم عنوان </h3>
</div>
<div id="w4" class="new-w" onmouseover="newsidebar('w4')">
<h3>عنوان </h3>
<p>محتوای فریم آخر </p>
</div>
</div>

من تابع احضار پیوندها را قرار دادم و باقی را هم که خودتان ظاهرا کدهایشان را دارید و قرار می دهید

اگر خواستید عرض منو را کم یا زیاد کنید در اولین سری کدها که در style.css قرار دادید بگردید دنبال


width:240px;

و عددش را تغییر دهید

3

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


لینک به پست

سلام . خیلی ممنون از لینکهای خوبی که معرفی کردید آقا مرتضی.

فقط 2 تا سوال: فرض کنید من میخوام از لینک اولی که معرفی فرمودید استفاده کنم.

1- من داخل قالبم اصلا فایل جی کوئری ندارم، این قسمت دستورات جی کوئری رو کجا بریزم، اگه لازمه فایلی با پسوند js داخل تم سایتم آپلود کنم لطفا اسم دقیقش رو بفرمایید. چون دستورات css رو که میریزم داخل فایل style.css دستورات html اش رو هم میریزم داخل فایل php ای که مورد نظرمه، ولی واسه ی جی کوئری هاش نمیدونم چیکار کنم؟؟؟؟؟؟؟؟؟؟

2- این دستورات html رو بدون هیچ تغییری بریزم داخل php مشکلی نداره؟

یا لطفن مثلن طرز استفاده از کدهای سایت زیر رو واسم توضیح بدین من که هر کاری کردم نتونستم: :( :(

http://roshanbh.com....ing-jquery.html

آقای استاد ممنونم. درست شد. :D ولی اگه جواب 3 تا سوال بالا رو هم بدید دیگه کاملا همه چیزو در مورد طرز استفاده ی این کدا می فهمم!!! ممنون

0

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


لینک به پست

در بخش آموزش jquery را جستجو کنید پاسخ تمام سئوالاتتان آنجاست

2

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


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری