Javascript- open window in same window

C++, C#, Java, PHP, ect...
Post Reply
aduss
Posts: 12
Joined: Sat Mar 17, 2012 6:02 pm

Javascript- open window in same window

Post by aduss »

Hello, i would like to ask if anybody can help me with open window in same window like is on west(see the picture below :) ). Thanks in advance. Image
User avatar
Jackolantern
Posts: 10891
Joined: Wed Jul 01, 2009 11:00 pm

Re: Javascript- open window in same window

Post by Jackolantern »

Here is a nice little tutorial that gets you up to a pretty decent result by the end. My only reservation is that I did not go all through it to see what age it comes from, because it refers to Javascript techniques as "DHTML", which is kind of a red flag to JS programmers. That was the term used for JS techniques during the Browser Wars. If it is old (if they even mention "Netscape Navigator", run!), you can Google around for some more. I just liked this one because it starts from basically nothing and continues to build it up to a decent result :)

Here is the forum listing I found the tutorial in, and the second post also gives a list of some pre-made plugins for popular JS libraries, such as jQuery. With these types of plugins, you can often write regular, alternative HTML pages that you can then setup to open as extremely sophisticated faux pop-up windows with only a line or two of JS code. The downside is that if you are only using a library such as jQuery or Prototype for faux pop-up windows, that will add some girth to your page's initial download for a pretty small usage. However, broadband internet services and popular CDNs can basically negate those library script download times (Google "Google CDN jQuery" if you decide to go the plugin route; it is extremely easy and can save on the entire download for many site visitors).

Hope this helps!
The indelible lord of tl;dr
aduss
Posts: 12
Joined: Sat Mar 17, 2012 6:02 pm

Re: Javascript- open window in same window

Post by aduss »

Thanks :)
Zykal
Posts: 31
Joined: Thu Nov 29, 2012 4:38 am

Re: Javascript- open window in same window

Post by Zykal »

Good little tutorial

I'm looking at using something like this for my backpack system, is this the best way to do it?


I was wondering if you can use the same button to open and close it along with a little X as normal.

Also if 2 or more of these windows are open can they interact with each other?
Like taking an item from one pack and moving it to another?


Thanks
User avatar
xcalpro
Posts: 65
Joined: Sat May 19, 2012 10:25 pm

Re: Javascript- open window in same window

Post by xcalpro »

Looking through their page source code, you can see they are using XHTML with jQuery being used to manipulate the DOM elements. If you go to www.codeschool.com you can take a really nice course on JQuery for free which shows you how to use JQuery to add or remove window elements.
Skills: HTML5, JavaScript, PHP, SQL, Python, BASIC, HeroEngine(HSL), AGS(Lua), Unity, Photon, 3D Max, Mudbox, Photoshop, Poser, Flash
"Jack-of-all-Trades, Master of none"
Zykal
Posts: 31
Joined: Thu Nov 29, 2012 4:38 am

Re: Javascript- open window in same window

Post by Zykal »

Awesome i took a little tour looks great maybe just what i'm looking for. I was glad to see you can Download the videos, i'll have to do that this weekend when I'm on a hard line.

Thanks
User avatar
Jackolantern
Posts: 10891
Joined: Wed Jul 01, 2009 11:00 pm

Re: Javascript- open window in same window

Post by Jackolantern »

Yes, since these are not real pop-up windows, you can script out whatever behavior you want. They can communicate between each other, one button can both open and close them, etc. Real pop-up windows are terrible and are the target of all kinds of restrictions from the browsers and anti-virus pop-up blockers, as well as the fact that they are isolated from interacting with other pages outside of the newer HTML5 cross-page communications API (but even that has limited implementation).

Going the jQuery way frees you from all of that because they aren't pop-ups. They are still part of the same page with some clever styling and scripting to make them look like they are another window, such as allowing you to drag them around, open and close them, etc. And since these other "windows" are all part of the same page, that means sharing data, novel open and closing functions and others are all simply a matter of scripting them. A good plugin could likely make showing your page as simple as a single function call along with a bit of option setting, and that could be triggered by anything you want with jQuery's simple event system.

A jQuery plugin such as TopUp would probably be the way to go. :cool:
The indelible lord of tl;dr
Post Reply

Return to “Coding”