Jump to content

Recommended Posts

I am very new to web and am learning basic stuff right now as much as I can.  But I saw this web site and think the drop downs and picture loading is the coolest.  I am lead to believe its PHP because of the extesion.  Can anybody help me into understanding this?  Is it something I could do in HTML, CSS, or Dreamweaver or something a little easier for my newbie brain to wrap around?

 

www.thomascheng.com/portfolio.php

Link to comment
https://forums.phpfreaks.com/topic/126650-need-help-understanding-this-site/
Share on other sites

That technique is done using Javascript. It shouldn't be too difficult to achieve the same effect using a framework such as jQuery. The menu can be done using it's built-in show() and hide() functions. The smooth scrolling can be done using a jQuery plugin such as ScrollTo (demo).

I am lead to believe its PHP because of the extesion.

 

The extension is just what kind of file it is.  You have have multiple languages in 1 file.  For example, I use PHP, MySQL, HTML, and Javascript.  Most languages can be intertwined together.

I am lead to believe its PHP because of the extesion.

 

The extension is just what kind of file it is.  You have have multiple languages in 1 file.  For example, I use PHP, MySQL, HTML, and Javascript.  Most languages can be intertwined together.

 

 

But isnt this site loading dynamically or something?  When I use the source viewing in the browser, it is only showing the selected topics.  I cant see where the other stuff would be coming from. 

 

ie:  this is from the source when academic is loaded:

 

 

<div class='main_content'>

<div class='image_and_desc 1'><div class='mainimagediv_v'><img src='images/localfood2.jpg' alt="Local Food" width='447' height='533' /></div><div class='piece_desc_v' style='margin-top: 420px;'><h1>Local Food</h1><h2>version two</h2><p>An ad for local food awareness targetted at readers of Now Magazine, a hip, culture-centric publication.</p>    </div></div><div class='image_and_desc 2'><div class='mainimagediv_v'><img src='images/localfood.jpg' alt="Local Food" width='426' height='533' /></div><div class='piece_desc_v' style='margin-top: 456px;'><h1>Local Food</h1><h2>version one</h2><p>Another ad for local food using a typographic approach.</p>    </div></div><div class='image_and_desc 3'><div class='mainimagediv_h'><img src='images/photosharing.jpg' alt="Snapshots" width='704' height='379' /></div><div class='piece_desc_h' style='width: 704px'><h1>Snapshots</h1><p>An interactive Flash presentation that demonstrates online photo-sharing and the profound effects it can have on people.</p>    <p class='extlink'><a href="http://www.thomascheng.com/P4/movie.html" onclick='window.open(this.href); return false;'><span class='bold'>&#187;</span> Open project in new window</a></p></div></div>

 

 

 

But when another section is loaded, its the same as above.  I cannot figure out where the other image links are coming from...

 

 

That's a technique called AJAX. In this instance you could call it dynamic loading, as you say. AJAX means "Asynchronous Javascript and XML" (XML doesn't actually have to be used). Basically you create a request to a backend (that could indeed be written using PHP) and it'll send something back. You can then modify DOM (Document Object Model) using Javascript.

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.