Fix IE6 overlap and remove unnecessary markup. Props tellyworth. fixes #6661 for trunk

git-svn-id: http://svn.automattic.com/wordpress/trunk@7677 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
ryan 2008-04-14 20:48:11 +00:00
parent 47c6ee0e09
commit b97e7fa82b
3 changed files with 21 additions and 28 deletions

View File

@ -92,8 +92,7 @@ tr.image-size label {
}
.filename.original {
z-index: 10;
position: absolute;
float: left;
}
.crunching {
display: block;
@ -125,14 +124,18 @@ button.dismiss {
border-right-width: 3px;
border-right-style: solid;
}
#library-form .progress, #gallery-form .progress {
display: none;
}
.media-item .thumbnail {
max-width: 128px;
max-height: 128px;
}
.media-item .pinkynail {
position: absolute;
top: 2px;
left: 2px;
float: left;
margin: 2px;
height: 32px;
max-width: 40px;
}
@ -171,23 +174,14 @@ abbr.required {
.describe-toggle-on, .describe-toggle-off {
display: block;
line-height: 36px;
z-index: 2;
position: absolute;
top: 0px;
right: 20px;
float: right;
margin-right: 20px;
}
.describe-toggle-off {
display: none;
}
.clickmask {
background: transparent;
position: absolute;
top: 0px;
left: 0px;
cursor: pointer;
border: none;
z-index: 3;
height: 36px;
}
.hidden {
@ -217,17 +211,16 @@ abbr.required {
}
#media-upload .media-item {
position: relative;
border-bottom-width: 1px;
border-bottom-style: solid;
width: 623px;
position: relative;
min-height: 36px;
width: 100%;
}
.filename {
display: block;
line-height: 36px;
margin-left: 50px;
z-index: 2;
margin-left: 10px;
float: left;
}
#media-upload .describe {
border-top-width: 1px;
@ -246,4 +239,4 @@ abbr.required {
#media-upload tr.image-size {
margin-bottom: 1em;
height: 3em;
}
}

View File

@ -607,7 +607,7 @@ function get_media_items( $post_id, $errors ) {
foreach ( $attachments as $id => $attachment )
if ( $item = get_media_item( $id, array( 'errors' => isset($errors[$id]) ? $errors[$id] : null) ) )
$output .= "\n<div id='media-item-$id' class='media-item child-of-$attachment->post_parent preloaded'><div id='media-upload-error-$id'></div><div class='filename'></div><div class='progress'><div class='bar'></div></div>$item<div class='progress clickmask'></div>\n</div>";
$output .= "\n<div id='media-item-$id' class='media-item child-of-$attachment->post_parent preloaded'><div class='progress'><div class='bar'></div></div><div id='media-upload-error-$id'></div><div class='filename'></div>$item\n</div>";
return $output;
}

View File

@ -12,7 +12,9 @@ function fileQueued(fileObj) {
jQuery('.slidetoggle').slideUp(200).siblings().removeClass('hidden');
}
// Create a progress bar containing the filename
jQuery('#media-items').append('<div id="media-item-' + fileObj.id + '" class="media-item child-of-' + post_id + '"><div class="filename original">' + fileObj.name + '</div><div class="progress"><div class="bar"></div></div></div>');
jQuery('#media-items').append('<div id="media-item-' + fileObj.id + '" class="media-item child-of-' + post_id + '"><div class="progress"><div class="bar"></div></div><div class="filename original">' + fileObj.name + '</div></div>');
// Display the progress div
jQuery('#media-item-' + fileObj.id + ' .progress').show();
// Disable the submit button
jQuery('#insert-gallery').attr('disabled', 'disabled');
@ -31,6 +33,7 @@ function uploadProgress(fileObj, bytesDone, bytesTotal) {
function prepareMediaItem(fileObj, serverData) {
// Move the progress bar to 100%
jQuery('#media-item-' + fileObj.id + ' .bar').remove();
jQuery('#media-item-' + fileObj.id + ' .progress').hide();
// Append the HTML returned by the server -- thumbnail and form inputs
jQuery('#media-item-' + fileObj.id).append(serverData);
@ -41,9 +44,6 @@ function prepareMediaItem(fileObj, serverData) {
// Replace the original filename with the new (unique) one assigned during upload
jQuery('#media-item-' + fileObj.id + ' .filename.original').replaceWith(jQuery('#media-item-' + fileObj.id + ' .filename.new'));
// Bind toggle function to a new mask over the progress bar area
jQuery('#media-item-' + fileObj.id + ' .progress').clone().empty().addClass('clickmask').bind('click', function(){jQuery(this).siblings('.slidetoggle').slideToggle(150);jQuery(this).siblings('.toggle').toggle();}).appendTo('#media-item-' + fileObj.id);
// Also bind toggle to the links
jQuery('#media-item-' + fileObj.id + ' a.toggle').bind('click', function(){jQuery(this).siblings('.slidetoggle').slideToggle(150);jQuery(this).parent().eq(0).children('.toggle').toggle();jQuery(this).siblings('a.toggle').focus();return false;});