خرید بک لینک,خرید رپورتاژ آگهی

ساخت Css Menu همراه با Sider

شروع موضوع توسط desiran ‏2 ژوئن 2007 در انجمن CSS

  1. desiran

    desiran Registered User

    تاریخ عضویت:
    ‏4 آپریل 2006
    نوشته ها:
    91
    تشکر شده:
    1
    حتما مشابه این منو را در کارهای فلش زیاد دیده اید. این بار ما با استفاده از Prototype.js و Css این منو ساده و زیبا رو به راحتی درست می کنیم.سعی می کنم که بصورت ساده توضیح بدم.

    در ساخت این منو ما فقط به سه بخش کد نیاز داریم .

    1.HTML

    2.Css

    3.JavaScript

    مرحله ی اول: Html Code
    این کد خود منو هست که با تغییر مقادیر داخل تگهای li می توانید منوی مورد نظر خودتون رو درست کنید.

    HTML:
       1. <div id="menu">
       2. <div id="m-top">
       3. <ul>
       4. <li><a href="#">Home</a></li>
       5. <li><a href="#">About Us</a></li>
       6. <li><a href="#">F.A.Q.</a></li>
       7. <li><a href="#">Contact</a></li>
       8. </ul>
       9. </div>
      10. <div id="m-slider">
      11. <div id="slider"></div>
      12. </div>
      13. </div>
    
    مرحله ی دوم:Css
    شما می توانید با کمی تغییر در کد Css این منو با بازی با رنگ ها و تصویر منوی مورد علاقه ی خود رو بسازید.

    این فایل رو در صفحه ی خود به این صورت include کنید.

    HTML:
    <link href="slider.css" media="screen"type="text/css"rel="stylesheet">
    مرحله ی سوم:JavaScript
    باید این دو فایل جاوا اسکریپت هم در صفحه ی خود قراردهید. به دین صورت.

    HTML:
       1. <script src="prototype.js" type="text/javascript"></script>
       2. <script src="helper.js" type="text/javascript"></script>
    
    خوب می تویند فایل های مربوط به این منو را از اینجا دانلود کنید.

    منبع

    اگه متن مشکلی داره به بزرگی خودتون ببخشید. چون با ادیتور اینجا چیز بهتر از این نتونستم در بیارم.
     
avanakbron talent عسل طبیعی و گرده گل ایرانی