Placeholder is not shown in jquery sortable, drag & drop
Posted
by balakrishnan
on Stack Overflow
See other posts from Stack Overflow
or by balakrishnan
Published on 2010-04-06T15:21:36Z
Indexed on
2010/04/06
15:23 UTC
Read the original article
Hit count: 182
sortable
I can't show Place holder for the sortable items in a div.
<script type="text/javascript">
$(function() {
$("#userContent").sortable({
handle: '.close_button',
connectWith: '#userContent',
placeholder: 'placeholder',
forcePlaceholderSize: true,
tolerance: 'pointer',
revert: true,
});
});
</script>
<style type="text/css">
.webtitle_paragraphs {
width:98%;
float:left;
border:1px solid #0099CC;
margin:5px;
}
.close_button {
display:block;
overflow:visible;
visibility:visible;
height:20px;
background:#0099CC;
width:100%;
}
.placeholder {
background: #f0f0f0;
border:1px dashed #ddd;
visibility: visible !important;
}
.webtitle input { width:98%; font: bold 20px verdana; border:0px; } .paragraph_txt textarea { width:98%; height:auto; border:0px; } </style> </head> <body> <div id="userContent"> <div class="webtitle_paragraphs" id="div4463_text"> <div class="close_button" id="close_4463"><a onclick="removeDiv('div4463_text');"><img src="images/close_button.png" alt="close" width="15" height="15" border="0" align="right"/></a></div> <div class="webtitle_paragraph"> <div class="webtitle"> <input value="Title" name="webtitle4463" type="text" class="text _4463" /> </div> </div> </div> <div class="webtitle_paragraphs" id="div7192_image"> <div class="close_button" id="close_7192"><a onclick="removeDiv('div7192_image');"><img src="images/close_button.png" alt="close" width="15" height="15" border="0" align="right"/></a></div> <div class="webtitle_paragraph"> <div class="paragraph"><img src="https://localhost/web20/user_site_designs/images/noImage.jpeg" id="img7192" class="imageCntrl" onclick="uploadFile(7192)"/> <input type="hidden" name="imgName7192" id="imgName7192" value="" class="image _7192"/> </div> </div> </div> <div class="webtitle_paragraphs" id="div9683_paragraph"> <div class="close_button" id="close_9683"><a onclick="removeDiv('div9683_paragraph');"><img src="images/close_button.png" alt="close" width="15" height="15" border="0" align="right"/></a></div> <div class="webtitle_paragraph"> <div class="paragraph_txt"> <textarea class="paragraph _9683" name="myTextarea9683" id="myTextarea9683">Paragraphp</textarea> </div> </div> </div> </div>
Thanks is advance.
© Stack Overflow or respective owner
