Set custom class for Modal popup Magento 2
Different parameters can be used for Modal Popup creation by the reference of the file : vendor/magento/module-ui/view/base/web/js/modal/modal.js
<script>
require(['jquery','Magento_Ui/js/modal/modal'],
function($,modal) {
var options = {
type: 'popup',
responsive: true,
innerScroll: true,
title: 'Popup',
modalClass: 'see-detail-modal',
buttons: [{
text: $.mage.__('Close'),
class: 'product-popup-hide',
click: function () {
this.closeModal();
}
}]
};
$( ".see-details" ).click(function() {
var popup = modal(options, $('#see-details-popup'));
$('#see-details-popup').modal('openModal');
});
}
);
</script>
You could use "modalClass" to set a particular class for each modal. See all of the possible modal paremeters in the following file:
vendor/magento/module-ui/view/base/web/js/modal/modal.js
Go to your script code and add one line code: modalClass: 'question-modal' check below script.
require( [ 'jquery', 'Magento_Ui/js/modal/modal' ], function( $, modal ) { var options = { type: 'popup', responsive: true, innerScroll: true, modalClass: 'question-modal', buttons: [] }; var popup = modal(options, $('#question-popup')); $("#question-me").on('click',function(){ $("#question-popup").modal("openModal"); }); } );