show a div content with nyroModal

I'm using nyroModal jquery plugin. But I've a simple question: I have a hidden div, its id is mydiv (and style is display: none;). If user clicks on the another div with id button, mydiv should shows in a modal box.

Ho开发者_JAVA百科w?

(the body code is:)

<div id="mydiv" style="display: none;">
    abcdabcd
</div>
<div id="button">
    Click!
</div>

Thank you very much.

the fallowing code is for showing the div...

$('#button').click(function(){

      $('#mydiv').show();
});

if you want to show it in modal then you have to place this div in modal......

Other than simulating a click event from a hidden link i think this is the only way. You need to pass the data through using $.nmData(data, options) function.

$('#button').click(function(){
  $.nmData($('#mydiv').html());
});

I just want to show a simple popup , Please check the below snippet,

$(function(){
	var $button = $('#button');
	$button.on('click', function(){
		$('#modal_box').css('display','block');
	});
	$('.close').on('click', function(){
		$('#modal_box').css('display','none');
	});
});

#modal_box {
	width:50%;
	margin:0 auto;
	height:300px;
	text-align:center;
	position:absolute;
	right:;
	left:0;
	right:0;
	top:25%;
	display:none;
	background:#CCC;
}
.close {
    position: absolute;
    right: 15px;
    top: 15px;
}

<div id="modal_box"> <a href="#" class="close">Close</a></div>
<div id="button"> Click here </div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>