مرجع تخصصی برنامه نویسان

انجمن تخصصی برنامه نویسان فارسی زبان

کاربر سایت

arezoo.fg

عضویت از 1394/08/11

ایجاد modal

  • چهارشنبه 3 آذر 1395
  • 10:03
تشکر میکنم

سلام !

من یه modal ساده با jquery نوشتم که در حد add class  هستش. اما فقط برای یک آیتم کار میکنه . اگه بخوام چندتا modal  داشته باشم  نمیشه .کد jquery  و چجوری باید تغیر بدم؟

   $('#mdl').click(function () {
            $('.modal-box').addClass('show').fadeIn("fast");

        })

  <button type="button" id="mdl" data-target="#orderModal">modal</button>
        <div class ="modal-box">
            <a>click</a>
        </div>

.....

پاسخ های این پرسش

تعداد پاسخ ها : 6 پاسخ
کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • چهارشنبه 3 آذر 1395
  • 10:17

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

کلمه Modal را در سایت سرچ کنید

کاربر سایت

arezoo.fg

عضویت از 1394/08/11

  • چهارشنبه 3 آذر 1395
  • 10:29

درسته . دیدم. ولی با پلاگین , dialog  یا داخل mvc  هستش ,من با jquery  میخواستم. خودم بنویسم.

کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • چهارشنبه 3 آذر 1395
  • 10:33

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

پرح را دوبار اختراع نکنید برای واکنش گرا بودن باید کد زیادی بنویسید

کاربر سایت

arezoo.fg

عضویت از 1394/08/11

  • چهارشنبه 3 آذر 1395
  • 10:35

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

کاربر سایت

arezoo.fg

عضویت از 1394/08/11

  • چهارشنبه 3 آذر 1395
  • 11:13
کاربر سایت

سجاد باقرزاده

عضویت از 1392/02/24

  • چهارشنبه 3 آذر 1395
  • 11:49

وقتی شما دارید به کلاس .modal-box کلاس show را اضافه میکنید بنابراین همه elementهایی که این کلاس را دارند نمایش داده می شوند. شما برای نمایش هر modal در باکس جداگانه خودش همانند دکمه آن که id میگیرد می بایست id دهید و داخل کد jquery با کلیک بروی هر کدام از دکمه ها modal مزبوط به آن نمایش داده می شود. یا اینکه مانند bootstrap از یک خاصیت دیگر المت استفاده کنید data-، کدهای modal بوت استرپ را بررسی کنید .

کاربرانی که از این پست تشکر کرده اند

هیچ کاربری تا کنون از این پست تشکر نکرده است

اگر نیاز به یک مشاور در زمینه طراحی سایت ، برنامه نویسی و بازاریابی الکترونیکی دارید

با ما تماس بگیرید تا در این مسیر همراهتان باشیم :)