aboutsummaryrefslogtreecommitdiffstats
path: root/en
diff options
context:
space:
mode:
authorManuel Hiebel <leuhmanu@mageia.org>2014-08-18 22:30:36 +0200
committerManuel Hiebel <leuhmanu@mageia.org>2014-08-18 22:30:36 +0200
commitb31c610d6c9a95373987ebff76df357e81f8f31d (patch)
tree434b6973123b608fbeab5bbe0e051ea3f8401934 /en
parent212c3327a4386c4436130571d7cf7ca5e9fadeaf (diff)
downloadwww-b31c610d6c9a95373987ebff76df357e81f8f31d.tar
www-b31c610d6c9a95373987ebff76df357e81f8f31d.tar.gz
www-b31c610d6c9a95373987ebff76df357e81f8f31d.tar.bz2
www-b31c610d6c9a95373987ebff76df357e81f8f31d.tar.xz
www-b31c610d6c9a95373987ebff76df357e81f8f31d.zip
lazy log of images
load images only before they are needed, will reduce global time and size (and fix the removing of buttons if JavaScript disabled)
Diffstat (limited to 'en')
-rwxr-xr-xen/5/download_index.php25
1 files changed, 20 insertions, 5 deletions
diff --git a/en/5/download_index.php b/en/5/download_index.php
index 286061c20..b5a18f76d 100755
--- a/en/5/download_index.php
+++ b/en/5/download_index.php
@@ -54,6 +54,11 @@ echo $torrent && !$torrentavailable ? sprintf(_t('forthcoming')) : sprintf('<a
);
}
+function get_image($ttl, $src, $sty){
+ echo sprintf('<noscript><img class="lazy" src="%s" alt="%s" title="%s" style="%s" /></noscript>', $src, $ttl, $ttl, $sty);
+ echo sprintf('<img class="lazy" src="" data-src="%s" alt="%s" title="%s" style="%s" />', $src, $ttl, $ttl, $sty);
+}
+
?>
<!DOCTYPE html>
<html dir="ltr" lang="<?php echo $locale; ?>">
@@ -147,7 +152,7 @@ input[type="radio"], input[type="submit"] {
<noscript>
<div class="para warn"><?php _g('It looks like you have JavaScript disable. Please <a href="%s">enable</a> it to have better render. At the <a href="%s">end</a> of this page there will be download link for you. But what is written between is important.',array('http://www.enable-javascript.com/','#Fclassical'),'p'); ?></div>
-<style>.ui-button,.ui-button:link{display: none;}</style>
+<style>.radiobutton .ui-button{display: none;}</style>
</noscript>
<div class="para">
@@ -267,11 +272,13 @@ input[type="radio"], input[type="submit"] {
<div id="gnomeEx">
<?php _g('GNOME Desktop',null,'h3');?>
- <a href="/g/4/gnome.png"><img style="width: 100%;" src="/g/4/gnome.png" title="GNOME" alt="GNOME"></a>
+ <?php get_image('GNOME', '/g/4/gnome.png', 'width: 100%');?>
+ <!--<a href="/g/4/gnome.png"><img style="width: 100%;" src="/g/4/gnome.png" title="GNOME" alt="GNOME"></a>-->
</div>
<div id="kdeEx">
<?php _g('KDE Desktop',null,'h3');?>
- <a href="/g/4/kde.png"><img style="width: 100%;" src="/g/4/kde.png" title="KDE" alt="KDE"></a>
+ <?php get_image('KDE', '/g/4/kde.png', 'width: 100%');?>
+ <!--<a href="/g/4/kde.png"><img style="width: 100%;" src="/g/4/kde.png" title="KDE" alt="KDE"></a>-->
</div>
<div class="radiobutton">
@@ -538,6 +545,15 @@ $($cl).tooltipsy({
});
}
+function lazyload(){
+ $('img.lazy').each(function(){
+ $(this)
+ .attr( 'src', $(this).data('src') )
+ .removeClass('hidden')
+ .removeAttr('data-src');
+ });
+}
+
$('#iso2usb,#arch,#nat,#desktop,#livespin,#dllink').hide();
$('input[name=format]').click(function () {
$('#arch,label[for="dual"]')[this.id == 'classical' ? 'slideDown' : 'slideUp']();
@@ -570,13 +586,12 @@ $($cl).tooltipsy({
$('input[id="32b"]').prop('checked', true);
}
$('label[for="64b"],#64bex')[$('#livecd').is(':checked') ? 'slideUp' : 'slideDown']();
+ lazyload();
});
$('input[name=desktop]').click(function () {
$('#arch')[ $('#gnome,#kde').is(':checked') ? 'slideDown' : 'slideUp']();
- if (checked) {
scrolltoid('#arch')
- }
});
$('input[name=arch]').click(function () {