#javascript #jquery #css
#javascript #jquery #css
Вопрос:
У меня возникает проблема, приведенная ниже, при попытке настроить сайт с помощью навигации,
http://nickylurie.com.au/Temp/index.php
как вы можете видеть, изображение сайта слева некоторое время загружается, некоторое время нет, я использую приведенный ниже код для изменения изображения при переходе на другую страницу,
var pic = new Image();
pic.src = "images/homeLargeImg.jpg";
и ниже приведен мой внутренний код.
var RHigh=$(‘#Правая панель’).height() var windHigh=$ (окно).height()
$(pic).hide().load(function() { //отладчик; $(this).fadeIn(); var marginT=(windHigh/100*5) var imgH = (marginT windHigh)
$("#LeftPaneImage").html("<img id='triquibackimg' src='" pic.src "' style='" windHigh "'/>")
$("#LeftPane").css("width",$("#LeftPaneImage").width());
$("#RightPane").css("margin-left",$("#LeftPaneImage").width() 10);
resize()
})
$(window).bind(‘resize’, функция() { resize() });
функция resize() {
RHigh=$('#RightPane').height()
windHigh=$(window).height()
if( RHigh < windHigh)
{
$("#triquibackimg").css("height",$(window).height());
$("#LeftPane").css("width",$("#LeftPaneImage").width());
$("#RightPane").css("margin-left",$("#LeftPaneImage").width());
//----------------Right Pane vAlign--------------
(function ($) {
$.fn.vAlign = function() {
return this.each(function(i){
var h = $(this).height();
var oh = $(this).outerHeight();
var mt = (h (oh - h)) / 2;
$(this).css("margin-top", "-" mt "px");
$(this).css("top", "50%");
$(this).css("position", "absolute");
});
};
})(jQuery);
(function ($) {
$.fn.hAlign = function() {
return this.each(function(i){
var w = $(this).width();
var ow = $(this).outerWidth();
var ml = (w (ow - w)) / 2;
$(this).css("margin-left", "-" ml "px");
$(this).css("left", $("#LeftPane").width());
$(this).css("position", "absolute");
});
};
})(jQuery);
$(document).ready(function() {
$("#RightPane").vAlign();
//$("#RightPane").hAlign();
});
}
else
{
$("#triquibackimg").css("height",(RHigh 150));
$("#LeftPane").css("width",$("#LeftPaneImage").width());
$("#RightPane").css("margin-left",$("#LeftPaneImage").width());
// if ($(window).height()>800){
// $(«#RightPane»).css(«position», «relative»);
// }
// else{$(«#RightPane»).css(«margin-top»,60)}
}
}
может кто-нибудь посоветовать по этому поводу?
Спасибо
Ответ №1:
Оффтопик: Я хотел прокомментировать эти вопросы, потому что у меня нет ответа (пока), это неубедительно, что у меня должно быть повторение 50, чтобы прокомментировать..
Ontopic: Чего вы пытаетесь достичь и в чем проблема?
- Когда я пытаюсь просмотреть ваш веб-сайт, загружаются все большие изображения слева (Mac, chrome), я проверил все страницы..
- Они загружаются очень медленно..
- Почему вы хотите вставить изображение с помощью javascript, а не просто с помощью тега img?
Комментарии:
1. на самом деле я хочу изменить размер левого изображения по высоте браузера, и когда я изменяю размер изображения окна, измените размер в соответствии с высотой окна. и правая панель и навигация перемещаются в соответствии с этим, также правая панель должна быть v выровнена по окну.
2. До сих пор я не замечал вашего комментария, он все еще актуален для ответа?