مرجع پارسی MyBB

سلام به همه ی دوستان و سال نو رو هم به همه تبریک میگم

واقعیتش من یه ساید بار دیدم توی یکی از سایت ها کل با کلیک کردن میومد بیرون و با کلیک کردن میرفت تو و خیلی هم جالب بود
از مدیر سایت هم خواستم کمکم نکرد

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

حالا میخواستم ببینم کسی میتونه کمکم کنه

نمونه مورد نطر

[تصویر: 1717.gif]

با درود و شادباش برای سال نو و جشن نوروز 1393
این کارها را با کمی جستجو در نت می توان پیدا کرد و با خارجی ها بهتر میشه کنار اومد . هم میهنان , زیاد اهل اشتراک گذاری نیستند چون تعداد کمی از دوستان با زحمت زیاد و پس از مونتاژ کاری به نتیجه می رسند و فکرشان این است که آی دنیا من اختراع کردم ( چون در جاهای دیگر هم مطلب شما را دیدم و کسی مایل به راهنمایی شما نبود عرض کردم ) به هر حال این کار را می توانید از اینجا دریافت کنید ولی کارهای بهتری می توانید درست کنید و بهتر است از دیگران ایده گرفته و نو کاری کنید و نه دوباره کاری (کارهای زیبا جای خود را دارند) . سال خوبی داشته باشید Heart

درود

با تشکر از میدوی عزیز برای این که قابلیت باز و بسته شدن با کلیک را ایجاد کنید نیاز به کمی جاوا اسکریپت دارید

خوب من برای تکمیل کردنش نحوه ی کلی قرار دادنش رو براتون میگم البته هنوز خودم این کد را تست نکردم و نمیدونم آخرش چه شکلی میشه Tongue

به قالب مورد نظر و سپس قالب های گروه بندی نشده برید سپس به هدر اینکلود
کد زیر را آخر کد ها کپی کنید و ذخیره

کد: 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>

<script src="http://tab-slide-out.googlecode.com/files/jquery.tabSlideOut.v1.3.js"></script>

    <script type="text/javascript">

    $(function(){

        $('.slide-out-div').tabSlideOut({

            tabHandle: '.handle',                     //class of the element that will become your tab

            pathToTabImage: 'images/contact_tab.gif', //path to the image for the tab //Optionally can be set using css

            imageHeight: '122px',                     //height of tab image           //Optionally can be set using css

            imageWidth: '40px',                       //width of tab image            //Optionally can be set using css

            tabLocation: 'left',                      //side of screen where tab lives, top, right, bottom, or left

            speed: 300,                               //speed of animation

            action: 'click',                          //options: 'click' or 'hover', action to trigger animation

            topPos: '200px',                          //position from the top/ use if tabLocation is left or right

            leftPos: '20px',                          //position from left/ use if tabLocation is bottom or top

            fixedPosition: false                      //options: true makes it stick(fixed position) on scroll

        });

    });

    </script>

سپس به قالب هدر یا جایی که که میخواهید باکس اونجا رویت بشه برید و کد زیر را در جای مناسب قرار بدید ( تست کنید ببینید کجا بهتره)

کد: 
<div class="slide-out-div">

            <a class="handle" href="http://link-for-non-js-users.html">Content</a>

            <h3>Contact me</h3>

            <p>Thanks for checking out my jQuery plugin, I hope you find this useful.

            </p>

            <p>This can be a form to submit feedback, or contact info</p>

        </div>

سپس بیرد به پوسته ها و پوسته ی مورد نظر و سپس global.css

حالا کد زیر را آخر کد ها کپی کنید

کد php: 
.slide-out-div {
          padding: 20px;
          width: 250px;
          background: #ccc;
          border: 1px solid #29216d;
      } 

خوب حالا یک شات بزارید ببینیم چه شد Big Grin

ضمنا با جست و جو در گوگل برای مثلا : باکس جی کوری باز باز شونده مطلب و کد های آماده پیدا خواهید کرد.

نکته خط اول در کد اول

کد: 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>

که گذاشتیم برای فراخوانی کتاب خانه جی کوئری هستش اگه این بانک قبلا در قالب شما برای قابلیتی دیگر فراخوانی شده نیازی نیست دوباره تکرار شود.
و خط های بعدی نیز برای دستوراتی هست که به کتابخانه داده میشه

منظور کد های زیر است

کد: 
<script src="http://tab-slide-out.googlecode.com/files/jquery.tabSlideOut.v1.3.js"></script>

    <script type="text/javascript">

    $(function(){

        $('.slide-out-div').tabSlideOut({

            tabHandle: '.handle',                     //class of the element that will become your tab

            pathToTabImage: 'images/contact_tab.gif', //path to the image for the tab //Optionally can be set using css

            imageHeight: '122px',                     //height of tab image           //Optionally can be set using css

            imageWidth: '40px',                       //width of tab image            //Optionally can be set using css

            tabLocation: 'left',                      //side of screen where tab lives, top, right, bottom, or left

            speed: 300,                               //speed of animation

            action: 'click',                          //options: 'click' or 'hover', action to trigger animation

            topPos: '200px',                          //position from the top/ use if tabLocation is left or right

            leftPos: '20px',                          //position from left/ use if tabLocation is bottom or top

            fixedPosition: false                      //options: true makes it stick(fixed position) on scroll

        });

    });

    </script>

موفق باشید

dozanani

میدوری

صالح غلامیان