javascript - Div moves out of window when resized -


whenever resize browser, div moves out of window. use jquery scroll plugin navigating through divs. when resize #home div works fine, when resize other divs, gets out of window.

please me out, here link website.

here code used,

$(document).ready(function() { $("#bg-home").backstretch("images/bg-home3.jpg"); var images = ['1.jpg', '2.jpg','3.jpg']; $("#container").backstretch('images/' + images[math.floor(math.random() * images.length)]);     $( "#draggable" ).draggable({       drag: function() {       $(".scrolldown span").css("color","lightgreen").html("drop");       },       stop: function() {         $(".scrolldown span").css("color","white").html("drag");       },axis: "x",containment:"#menu",scroll: false//,grid: [ 159,0 ]     }); $(".content,.content1").droppable({drop: function() {         var $url = $(this);         document.title = $url.attr('alt');         $('html, body').scrollto($url.attr('id'),500,"easeinoutexpo");         //event.preventdefault();       }});         $("#welcome").effect("slide",3000);         $("#welcome").click(function()         {             $("#welcome").animate({left: "-1000px"},"easeinoutbounce");             $(".about_w").animate({left: "100px"},"easeinoutbounce");             $(".about_w").delay(4000).animate({left: "-800px"});             $("#welcome").delay(4500).animate({left: "100px"});          }); $('#menu a').bind('click',function(event){         var $url = $(this);         document.title = $url.attr('alt');         $('html, body').scrollto($url.attr('href'),500,"easeinoutexpo");         event.preventdefault();     }); $("#about .text p").vertiscroll({ width:6, color:'#f07','cover': 200,'areacursor': 'pointer' }); $('.side_container').slimscroll({     height:"88%",     color: '#fff',     start: $('.side_container'),     alwaysvisible: false }); $('#container_wrap_metro').slimscroll({     height:"400px",     color: '#fff',     railvisible: false,     alwaysvisible: false }); $(".menu nav").click(function(){     $url = $(this);   $(".text p").load($url.attr('id')); }); function loading_show() { $('#loading').html("<p style='color:white;'>loading</p><br><img src='images/loading.gif'/>").fadein('fast'); }  function loading_hide() { $('#loading').fadeout(); }  //status function loaddata(page) { loading_show(); $("#container_wrap_metro").html(""); $.ajax({       url: "load_data.php",       type: "post",       data: "page="+page,       success: function(data){             loading_hide();            $("#container_wrap_metro").html(data);       },       error:function(){           alert("failure");           $("#container_wrap_metro").html('unable process request!');       }       });  } function loads(page) { $.ajax({       url: "load_10.php",       type: "post",       data: "page="+page,       success: function(data){            $(".side_container").html(data);       },       error:function(){           alert("failure");           $(".side_container").html('unable process request!');       }       });  } loads(1); //search $("#result").keyup(function(){     $(".side_container").html('<center><i>fetching...</i></center>')     var q = $(this).val();     $.get("results.php?q="+q, function(data){     if(q){         $(".side_container").html(data);     }      else {         loads(1);     } }); }); });

try editing following lines:

$("#welcome").animate({left: "-1000px"},"easeinoutbounce"); $(".about_w").animate({left: "100px"},"easeinoutbounce"); $(".about_w").delay(4000).animate({left: "-800px"}); $("#welcome").delay(4500).animate({left: "100px"});

and:

height:"400px",

the earlier response right. when comes responsive web design, use em or % when setting sizes. can use 100% instead or 40 em. can change values until desired output.


Comments

Post a Comment

Popular posts from this blog

linux - xterm copying to CLIPBOARD using copy-selection causes automatic updating of CLIPBOARD upon mouse selection -

i've tried various ways coerce xterm (versions 285 , 292) copy selection clipboard clipboard whenever press ctrl-shift-c. promising way far has been, in ~/.xresources, put this: xterm*vt100.translations: #override \ ctrl shift <keypress> c: copy-selection(clipboard) \n\ ctrl shift <keypress> v: insert-selection(clipboard) ctrl-shift-v works perfectly, copying has nuance... if restart xterm, highlighting text puts things in primary clipboard; expected, proper, default behavior. if hit ctrl-shift-c, copies current selection clipboard clipboard. the bug, however, if highlight text after first time pressed ctrl-shift-c, you'll see highlighting copies both primary and clipboard. cannot figure out how stop xterm updating clipboard upon selection... , doesn't make sense me in first place. i said, @ specific point in time, copy selection clipboard... yet starts updating automatically upon selection after doing once... anyone have workaround...
Read more

qt - Errors in generated MOC files for QT5 from cmake -

i generated moc files qt5 using set (cmake_automoc on) set(cmake_include_current_dir on) then add moc files src using set(src src/main.cpp src/video_widget_surface.cpp src/video_widget.cpp src/video_player.cpp #moc files moc/moc_video_player.cpp moc/moc_video_widget.cpp moc/moc_video_widget_surface.cpp finally add executable using add_executable(somegui ${src}) but errors in moc files saying : /other/workspace/perception/somestuff/moc/moc_video_widget.cpp:54:6: error: 'videowidget' has not been declared /other/workspace/perception/somestuff/moc/moc_video_widget.cpp:62:19: error: 'videowidget' has not been declared /other/workspace/perception/somestuff/moc/moc_video_widget.cpp:68:20: error: 'videowidget' has not been declared /other/workspace/perception/somestuff/moc/moc_video_widget.cpp:68:46: error: non-member function 'const qmetaobject* metaobject()' cannot have cv-qualifier /other/qt5.0.1/5.0.1/gcc_64/include/qtcore/qo...
Read more