1
0

Use jQuery to preload images. Added thumbnail into comments page.

This commit is contained in:
3nids 2009-09-25 09:55:41 +02:00
parent 072ced072a
commit 50c94764f2
7 changed files with 30 additions and 13 deletions

View File

@ -25,6 +25,12 @@
float: right;
}
.gCommentThumb{
padding: 5px;
text-align: left;
}
/** *******************************************************************
* 1) Basic HTML elements
@ -546,6 +552,12 @@ form .gError,
.gCommentBox {
border-bottom: 1px solid #555;
}
.gCommentBox:hover{
background-color: black;
color: #ffffcc;
}
.gComment {
margin-left: 2em;
margin-top: .3em;

View File

@ -14,7 +14,8 @@
<? for($i=0;$i<$children_count;$i++): ?>
<? $child = $children_all[$i] ?>
<? if ($child->is_photo()): ?>
image_url[img_count] = "<?=$child->file_url()?>";
if(img_count>0){preload_image_object += ', ';}
preload_image_object += '"<?=$child->file_url()?>"';
img_count++;
<? endif ?>
<? endfor ?>

View File

@ -28,6 +28,7 @@
<?= $theme->head() ?>
</head>
<body class="modcontent">
<div class="gCommentThumb"> <img src="<?=$thumb?>"></div>
<a href="<?= url::site("form/add/comments_3nids/{$item_id}") ?>" id="gAddCommentButton"
class="gButtonLink ui-corner-all ui-icon-left ui-state-default right">
<span class="ui-icon ui-icon-comment"></span>
@ -42,7 +43,7 @@
<ul>
<? foreach ($comments as $comment): ?>
<li id="gComment-<?= $comment->id ?>" class="gCommentBox">
<?= t('%date, <b>%name</b>: ',
<?= t('<b>%name</b> <small>%date</small>: ',
array("date" => date(module::get_var("gallery", "date_time_format", "Y-M-d H:i:s"), $comment->created),
"name" => html::clean($comment->author_name()))); ?>
<div class="gComment">

View File

@ -14,7 +14,8 @@
<? for($i=0;$i<$children_count;$i++): ?>
<? $child = $children_all[$i] ?>
<? if ($child->is_photo()): ?>
image_url[img_count] = "<?=$child->file_url()?>";
if(img_count>0){preload_image_object += ', ';}
preload_image_object += '"<?=$child->file_url()?>"';
img_count++;
<? endif ?>
<? endfor ?>

View File

@ -14,3 +14,10 @@
<a href="<?= $item->parent()->url() ?>?show=<?= $item->id?>"><h4><span></span><?= $item->parent()->title ?></h4></a>
</div>
</div>
<script type="text/javascript">
if(img_count>0){preload_image_object += ', ';}
preload_image_object += '"<?=$item->file_url()?>"';
img_count++;
</script>

View File

@ -62,6 +62,7 @@
<?= $theme->script("jquery.localscroll.js") ?>
<?= $theme->script("jquery.easing.js") ?>
<?= $theme->script("jquery.fancybox.js") ?>
<?= $theme->script("jquery.preloadimages.js") ?>
<?= $theme->script("ui.init.js") ?>
<? /* These are page specific, but if we put them before $theme->head() they get combined */ ?>
@ -76,11 +77,6 @@
</head>
<body <?= $theme->body_attributes() ?>>
<script type="text/javascript">
preload_image_object = new Image();
image_url = new Array();
var img_count = 0;
</script>
<?= $theme->page_top() ?>
<div id="doc4" class="yui-t5 gView">
<?= $theme->site_status() ?>
@ -174,9 +170,7 @@
<?= $theme->page_bottom() ?>
<script type="text/javascript">
if (img_count > 0){
for(var i=0;i<=img_count;i++){
preload_image_object.src = image_url[i];
}
eval("$.preloadImages("+preload_image_object+");");
}
</script>
</body>

View File

@ -10,11 +10,12 @@
<? for($i=0;$i<$children_count;$i++): ?>
<? $child = $children_all[$i] ?>
<? if ($child->is_photo()): ?>
image_url[img_count] = "<?=$child->file_url()?>";
if(img_count>0){preload_image_object += ', ';}
preload_image_object += '"<?=$child->file_url()?>"';
img_count++;
<? endif ?>
<? endfor ?>
</SCRIPT>
</script>
<div id="gSearchResults">