• illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

    حرفه ای ترین دوره آموزش طراحی قالب وردپرس



  آیا می دانید میانگین رضایت دانشجویان سون لرن از دوره ها، بیش از 94% می باشد!

در این مطلب پنجمین نمونه از SVG فنری رو در اختیارتون میزارم.

در این مثال سه مربع در بالای صفحه وجود دارد که با کلیک بر روی X هر کدام ، حذف خواهد شد. همچنین در پایین یک شکل وجود داره که با کلیک بر روی Expand بزرگ میشه و با کلیک بر روی Compress به حالت اولیه خودش بر میگرده.

کدهای HTML :

در این مطلب از snap.svg-min.js و classie.js استفاده شده است.

کدهای CSS :

کدهای Javascript :

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

موفق باشید. یا علی

Source

نوع کد رايگان

دیدگاه ها 2 دیدگاه برای این مطلب ارسال شده است.

  • ‏‏

    با سلام…
    من تازه کارم…
    کد ها ی html و css رو کجای قالب باید کپی کنم؟ :sad:
    لطفا جواب رو ایمیل کنید
    با تشکر

    • ‏‏
      محمد اسفندیاری(۱۴ دی ۱۳۹۳)

      ببینید که میخواید این نمونه رو در کجای صفحتون قرار بدین ، بعد از اینکه این رو متوجه شدین ، کدهای HTML رو در همونجا Paste کنید و سپس کدهای CSS رو در فایل CSS خودتون و در کنار بقیه کدها قرار بدین……حالا نوبت به کدهای Javascript میرسه که باید اونا رو در کنار بقیه کدهای JS قرار بدین ، میتونین در فایل جداگونه ای هم قرار بدین و در انتهای کدهای HTML اونو لود کنید……در ضمن حتما باید از jQuery هم استفاده کنید
      موفق باشید

  • ارسال دیدگاه

    ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

    :: شما می توانید با استفاده از اکانت یاهو یا جیمیل خود به صورت کاملا امن، سریع و بدون نیاز به ورود اطلاعات عضو و وارد سایت شوید. در این صورت هیچ نیازی به ورود نام کاربری و رمز عبور خود نخواهید داشت و هویت شما از طریق ایمیلتان مورد تائید قرار می گیرد .
    برای استفاده از این روش باید در اکانت گوگل(جیمیل) و یا یاهوی خود لاگین باشید .
    عضویت/ ورود سریع با :
    در حال اتصال ...

    ورود به سایت

    ورود سریع با :
    در حال اتصال ...

    جستجو در سون لرن

    عبارت :
    7LearnTelegram