Solved

jquery trigger for window resize

Posted on 2012-03-29
5
499 Views
Last Modified: 2012-04-03
I am positioning an element on the screen using jquery. I would like it to move when the window is resized.

Right now I have thi code, which works, but I was wondering if anyone knew how to rewrite it using .trigger so that I don't have to write the positioning twice.

var w = $(window).width();
var h = $(window).height(); 

$(".tour").css({"top": 50, "left" : (w - 950)/2}).click(function(){
    
    location.href = "guided-tour.php";
});    

$(window).resize(function(){
    w = $(window).width();
    h = $(window).height();
    $(".tour").css({"top": 50, "left" : (w - 950)/2});
});

Open in new window


Thanks!
0
Comment
Question by:Kyle Hamilton
  • 3
  • 2
5 Comments
 

Expert Comment

by:Aminadav
ID: 37785359
Method 1:
var w = $(window).width();
var h = $(window).height(); 

a=function(){
$(".tour").css({"top": 50, "left" : (w - 950)/2}).click(function(){   
    location.href = "guided-tour.php";
});    
}

$(window).resize(a);
a();

Open in new window



Method 2 (I think it is better):
$(function () {
$(".tour").click(function(){
    location.href = "guided-tour.php";
});    
a=function(){
var w = $(window).width();
var h = $(window).height(); 
.css({"top": 50, "left" : (w - 950)/2})
}

$(window).resize(a);
$(window).trigget('resize');
})

Open in new window

0
 
LVL 25

Accepted Solution

by:
Kyle Hamilton earned 0 total points
ID: 37785411
I figured it out:

for anyone interested...

// define widths and heights globally for re-use...
var w = $(window).width();
var h = $(window).height();
var dh = $(document).height();

// position elements inside the resize, 
// and trigger resize to establish positioning on load.
$(window).resize(function(){

    w = $(window).width();
    h = $(window).height();

    $(".tour").css({"top": 50, "left" : (w - 950)/2});
    $(".navigation").css({"top": 100, "right" : (w - 950)/2});
    
}).trigger("resize");

// other functions...
$(".tour").click(function(){
    location.href = "guided-tour.php";
});

Open in new window

0
 

Expert Comment

by:Aminadav
ID: 37785425
This is the first answer of me here.
I want points for that.
0
 
LVL 25

Author Comment

by:Kyle Hamilton
ID: 37785437
You only get points when you come up with a solution, or something that leads to a solution.

Your script won't work. It's full of errors.
0
 
LVL 25

Author Closing Comment

by:Kyle Hamilton
ID: 37800067
...figured it out..
0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

In this article, we'll look how to sort an Array in JavaScript, including the more advanced techniques of sorting a collection of records either ascending or descending on two or more fields. Basic Sorting of Arrays First, let's look at the …
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

757 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now