Frames within the same window

HTML, CSS and anything else that deals with client side capabilities.

Moderator: General Moderators

Post Reply
Live24x7
Forum Contributor
Posts: 194
Joined: Sat Nov 19, 2011 9:32 am

Frames within the same window

Post by Live24x7 »

Hi

I want to implement a page where clicking on a link on the page opens the relevant content in a semi transparent frame within the same window (no popup windows)
When the user has read the content in the frame, he can escape to return back to the original frame.

I have seen this on Facebook (images) but am not sure what goes into achieving this.
Any suggestions ??
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: Frames within the same window

Post by califdon »

In the past this was often done with iframes, but I think most web designers today avoid using iframes, instead just using Javascript and CSS (and perhaps AJAX, if it's necessary to request additional content from the server). With Javascript and CSS you can easily specify or change the "innerHTML" of an element like a <div>, for example. Check out tutorials like http://www.tizag.com/javascriptT/javasc ... erHTML.php. The jQuery library can be useful in such techniques, too.
Live24x7
Forum Contributor
Posts: 194
Joined: Sat Nov 19, 2011 9:32 am

Re: Frames within the same window

Post by Live24x7 »

thanks for replying.. saw the tizag link but that is not quite near to what i am looking for.

or atleast it is still not clear how to use the innerhtml thing for making a frame..

Javascipt is not what i have coded ever.have avoided them and in worst cases copied other's code and modified to suit my needs -
this tutorial does not give me anything to to steal :)

Any other specific suggestion ?
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: Frames within the same window

Post by califdon »

Yes. Learn Javascript!! Without Javascript you can never hope to create useful web pages. It is the heart and blood of web page design. It is not a difficult language to learn. Do yourself a huge favor and DO IT.
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: Frames within the same window

Post by califdon »

If I'm understanding what you are trying to do, take a look at http://ravey.net/test/changecontentdemo.html, where I put up a temporary demo page to show you how it can be done with CSS and very simple Javascript. You can download the page source and play with it if you like.
Live24x7
Forum Contributor
Posts: 194
Joined: Sat Nov 19, 2011 9:32 am

Re: Frames within the same window

Post by Live24x7 »

wow, that is exactly what i wanted :)

you know what, I took your advice seriously - downloaded a pdf called javascript bible and am already done with first 50 easy pages.

Going by the content index , I think it will serve in good stead :)
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: Frames within the same window

Post by califdon »

I'm glad that you took the bull by the horns, so to speak. JS is so powerful that you will find uses for it in nearly every web page you create. Don't be discouraged if you can't remember all the syntax details. Try to understand the structure of the language and the structure of a web page (called the Document Object Model or DOM). Then use Google to refresh your memory when you need to. I created that demo page in under an hour, and much of that time was spent looking up details of syntax, like what order the arguments are in a function like substr() or how to make opacity/transparency work in all browsers, etc. Don't expect to remember all those details.

In addition to JS, learn all about CSS; with those 2 skills plus a general knowledge of HTML, you will have a set of tools that will enable you to create even fairly complex web pages.

That is, until you come to the place where you need to do things that depend on data stored at the server, such as user profiles, etc. For that you need PHP or other server languages. But first things first. Congratulations on diving into JS. When you encounter problems, return here to our forums and we will try to help you get through them.
Live24x7
Forum Contributor
Posts: 194
Joined: Sat Nov 19, 2011 9:32 am

Re: Frames within the same window

Post by Live24x7 »

i have been doing part-time server side codes in PHP/MYSQL and designs in CSS for the last 3 years.
I have written codes in c (during my study days) and am also learning python and the django webframework in my free time.
I have recently started learning OOP in Java & PHP.

The only thing i kept avoiding was coding in javascript. So far, I have used javascript only for client side form validations. Recently i discovered how to make sticky forms in PHP. This has made javascript validation kind of redundant.

But now that i am reading the book, its has been an easy read so far.. its much simpler than say learning Java. I have already thought of a simple game idea in JS but will try developing it after i am through with AJAX.


My first independent project was www.easyblood.info - an online database of voluntary blood donors in India.
I did this voluntarily for a nonprofit organization , which was more of a learning thing.

It has some 3000 members in the last 6 months and is growing so i think it was not a bad start.

This forum contributed big way in helping me get it working and i owe it to all who helped me get started

Now i am trying my hands at a second project, which is commercial idea (working on a super secret idea :)
As far as programming and features are concerned, it is likely a quantum jump from my previous simple project.

For one, I am trying to stick to OOP this time. (the last one was a procedural attempt)

The business idea is new - not seen websites exactly delivering on the idea.
In essence its an attempt to bring an existing huge offline industry on the online platform.

My database structure is getting more complex with every passing day as i try to add more features and usability to make the idea better. In the process i am honing my programnming skills and am really starting to appreciate the benefits of OOP.

Oops.. that was lot of story telling.

P.S: I visited your home page and saw your 'virtual home'.. its the best thing i have seen done on java platform. Never knew all that was possible with Java.
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: Frames within the same window

Post by califdon »

:) Thanks for the additional detail. Your easyblood page is easy to understand and navigate (I avoid saying 'attractive' since it might sound like I'm a vampire!) and I respect you for donating your time and skills to a worthwhile nonprofit like that! And it is also true that such work is a very good way to learn.

Your new (secret!) project sounds good, too, and I wish you success!

Actually, you have become involved in what I think are just the right technologies. You have worked with several technologies that I have not used, although I have been creating web pages since the early days of the web (I used to login to Arpanet before there was an Internet!). And I can see that you value OOP and other technologies. So I'm pleased that I encouraged you to add JS to your basket of tools! :)

Thanks for your comments on my virtual house. Just to clarify, I didn't code that in Java, I just used an open source package called SweetHome 3D http://www.sweethome3d.com. It does use the Java engine, though. I started to learn Java a few years ago, but never followed through. As you are finding, Javascript is far easier to learn than Java! (And, as you probably know, they are quite unrelated languages, except for their names.)

So good luck with your (secret!) venture. Let me know before your IPO so I can be a millionaire too! :D
Live24x7
Forum Contributor
Posts: 194
Joined: Sat Nov 19, 2011 9:32 am

Re: Frames within the same window

Post by Live24x7 »

No chance for an IPO... - the brain is in house, programmer in-house, designer in house and the promoter/marketer in house ;)
Where does that leave scope or need for any public offering ?

but will definitely consider you for preferential shares - provided you keep helping me during the build up process :)
User avatar
califdon
Jack of Zircons
Posts: 4484
Joined: Thu Nov 09, 2006 8:30 pm
Location: California, USA

Re: Frames within the same window

Post by califdon »

That's the best offer I've had in a long time! ;)
Post Reply