Welcome Guest ( Log In | Register)



3 Pages V  < 1 2 3 >  
 Reply to this topicStart new topic
> Target Links To A Div Layer, Is there such code that allows you to change ur link target so that it
keego
post Dec 14 2007, 11:09 AM
Post #11


Premium Member
********

Group: [HOSTED]
Posts: 151
Joined: 7-December 07
From: Melbourne,Australia
Member No.: 54,372
QUOTE(truefusion @ Dec 14 2007, 10:02 PM) *
What browser are you testing this in?




smile.gif i use firefox.. but it works now smile.gif


EDIT:

So now the photo link works. it shows in the div layer below.. But do you guys know how to do the same thing but with the Dynamic navigation?

The one that is dynamic is the link that says Gallery , scroll over it smile.gif

Oh and for some reason in firefox .. it cuts off my page at the bottom. but with IE it shows the entire thing... >.< is there a way i can fix that?

Thanks again

This post has been edited by keego: Dec 14 2007, 04:22 PM

(list)

Go to the top of the page
 
+Quote Post
sonesay
post Dec 14 2007, 09:48 PM
Post #12


|||[ n00b King ]|||
*********

Group: [HOSTED]
Posts: 685
Joined: 20-June 07
From: Auckland
Member No.: 45,102
for the drop down menu you can try this


your orginal code for photo link

CODE
<a href="java script:ajaxpage('photo.html','content');">Photo</a>


try to modify your javascript code from this

CODE
//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href="Modelling.htm">Modelling Album</a>'
menu1[1]='<a href="myphotos.htm">My Photos</a>'
menu1[2]='<a href="multimedia.htm">Multimedia Portfolio</a>'


to this

CODE
//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href="java script:ajaxpage('Modelling.html','content');">Modelling Album</a>'
menu1[1]='<a href="java script:ajaxpage('myphotos.html','content');">My Photos</a>'
menu1[2]='<a href="java script:ajaxpage('multimedia.html','content');">Multimedia Portfolio</a>'


as for the layout problem I'm not sure yet. did you build that whole layout from scratch? I usally find it best to find a template I like and copy or modify it as I still dont know how to build proper 100% height auto spanning div layouts off by heart and from scratch. There usally is alot of nested divs inside each other to achieve this which can be very consfusing.

This post has been edited by sonesay: Dec 14 2007, 09:54 PM

(list)

Go to the top of the page
 
+Quote Post
keego
post Dec 14 2007, 10:43 PM
Post #13


Premium Member
********

Group: [HOSTED]
Posts: 151
Joined: 7-December 07
From: Melbourne,Australia
Member No.: 54,372
Yeah i tried that. but when i do... the drop down menu doesnt work.. and just acts like a normal link

and for the layout.. yeah i started from scratch. i guess ill try to figure that out later on.

(list)

Go to the top of the page
 
+Quote Post
sonesay
post Dec 14 2007, 11:04 PM
Post #14


|||[ n00b King ]|||
*********

Group: [HOSTED]
Posts: 685
Joined: 20-June 07
From: Auckland
Member No.: 45,102
sorry i keep giving out bad code i dont check properly reason code breaks is ' ' are closing instead of being escaped with \'



CODE
var menu1=new Array();
menu1[0]='<a href="java script:ajaxpage(\'Modelling.html\',\'content\');">Modelling Album</a>';
menu1[1]='<a href="java script:ajaxpage(\'myphotos.html\',\'content\');">My Photos</a>';
menu1[2]='<a href="java script:ajaxpage(\'multimedia.html\',\'content\');">Multimedia Portfolio</a>';


should work.

edit: java script should just be one word 'javascript'. I dont know why it renders with a space in the code box. either way might work but i dunno

This post has been edited by sonesay: Dec 14 2007, 11:07 PM

(list)

Go to the top of the page
 
+Quote Post
keego
post Dec 15 2007, 07:00 AM
Post #15


Premium Member
********

Group: [HOSTED]
Posts: 151
Joined: 7-December 07
From: Melbourne,Australia
Member No.: 54,372
hahahahha YOU ARE SO COOL!!!! lol... ^^ thanks so much for the help. i hope it hasn't been a bother. cause i know for sure ill be posting in this thread alot more until the day i finally finish the site LOL...!!! thank you thank you... prob take me a million years to figure it out. LOL



EDIT :

You know how currently my content loads in a div box below.. i can't get the lightbox working though... i tried adding the javascript codes into the main home.. page...

www.keegonguyen.com/home.htm .. but still doesnt work.. is there a way i can get it to work even though it loads in a div box? smile.gif

thanks

This post has been edited by keego: Dec 17 2007, 10:30 AM

(list)

Go to the top of the page
 
+Quote Post
sonesay
post Dec 18 2007, 09:39 PM
Post #16


|||[ n00b King ]|||
*********

Group: [HOSTED]
Posts: 685
Joined: 20-June 07
From: Auckland
Member No.: 45,102
Just add this thse two items to your home.htm page

1
CODE
<title>Keego Nguyen's Official Site</title>
<link rel="stylesheet" href="myCSS.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

style sheet link for your lightbox.css file.


2
CODE
function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(containerid).innerHTML=page_request.responseText;
Lightbox.prototype.initialize();
}


for this you just need to add 'Lightbox.prototype.initialize();' all this does is reload light box after your ajax call is finished. for the most part it does seem to work but sometimes i notice the light box borders for the image beind displayed is broken and sometimes its fine. I still am not sure why it probbaly has sometime to do with conflicts in css files. its just a guess though, but let me know if it works on your end.



I tested the code out and it seems to work so far. I noticed a few things you should change to keep your code abit clean
1. you have 2 copies of the ajax javascript function from dynamic drive I would suggest you delete one.
2.

CODE
//Contents for menu 2, and so on
var menu2=new Array()
menu2[0]='<a href="http://cnn.com">CNN</a>'
menu2[1]='<a href="http://msnbc.com">MSNBC</a>'
menu2[2]='<a href="http://news.bbc.co.uk">BBC News</a>'


doesnt look like its being used you could delete it also.

This post has been edited by sonesay: Dec 18 2007, 09:44 PM

(list)

Go to the top of the page
 
+Quote Post
keego
post Dec 19 2007, 05:38 AM
Post #17


Premium Member
********

Group: [HOSTED]
Posts: 151
Joined: 7-December 07
From: Melbourne,Australia
Member No.: 54,372
okay currently doesnt work because i dont know where to the put the second code.. you wrote put both of the 2 codes in home.htm right?



so where do i post this one below? anywhere in home.htm?


function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(containerid).innerHTML=page_request.responseText;
Lightbox.prototype.initialize();
}



EDIT : im currently capped and can't access my cpanel.. and in my browser .. my home.htm doesnt load. so hopefully ill drop by someones place and see if i can sign in there. i currently can't upload the page that ive pasted the code in.. so yeahh u wont see it online just yet

This post has been edited by keego: Dec 19 2007, 05:57 AM

(list)

Go to the top of the page
 
+Quote Post
sonesay
post Dec 19 2007, 06:12 AM
Post #18


|||[ n00b King ]|||
*********

Group: [HOSTED]
Posts: 685
Joined: 20-June 07
From: Auckland
Member No.: 45,102
that function just got one line added to it. heres a copy I have if you just want to copy and paste that. Its got the second copy of ajax functions removed.


CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

&lt;script type="text/javascript">

/***********************************************
* Dynamic Ajax Content- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var bustcachevar=1 //bust potential caching of external pages after initial request? (1=yes, 0=no)
var loadedobjects=""
var rootdomain="http://"+window.location.hostname
var bustcacheparameter=""

function ajaxpage(url, containerid){
var page_request = false
if (window.XMLHttpRequest) // if Mozilla, Safari etc
page_request = new XMLHttpRequest()
else if (window.ActiveXObject){ // if IE
try {
page_request = new ActiveXObject("Msxml2.XMLHTTP")
}
catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
else
return false
page_request.onreadystatechange=function(){
loadpage(page_request, containerid)
}
if (bustcachevar) //if bust caching of external page
bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()
page_request.open('GET', url+bustcacheparameter, true)
page_request.send(null)
}

function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(containerid).innerHTML=page_request.responseText;
Lightbox.prototype.initialize();
}

function loadobjs(){
if (!document.getElementById)
return
for (i=0; i<arguments.length; i++){
var file=arguments[i]
var fileref=""
if (loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding
if (file.indexOf(".js")!=-1){ //If object is a js file
fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", file);
}
else if (file.indexOf(".css")!=-1){ //If object is a css file
fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", file);
}
}
if (fileref!=""){
document.getElementsByTagName("head").item(0).appendChild(fileref)
loadedobjects+=file+" " //Remember this object as being already added to page
}
}
}

</script>

<style type="text/css">

#dropmenudiv{
position:absolute;
border:0px solid black;
border-bottom-width: 0;
font:normal 12px Verdana;
line-height:18px;
z-index:100;
}

#dropmenudiv a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 0px solid black;
padding: 1px 0;
text-decoration: none;
font-weight: bold;
color: black;
}

#dropmenudiv a:hover{ /*hover background color*/
background-color: #ffccff;
color: white;
}

</style>

&lt;script type="text/javascript">

/***********************************************
* AnyLink Drop Down Menu- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href="java script:ajaxpage(\'photo.html\',\'content\');">Modelling Album</a>';
menu1[1]='<a href="java script:ajaxpage(\'photo.html\',\'content\');">My Photos</a>';
menu1[2]='<a href="java script:ajaxpage(\'multimedia.html\',\'content\');">Multimedia Portfolio</a>';



var menuwidth='165px' //default menu width
var menubgcolor='lightyellow' //menu bgcolor
var disappeardelay=250 //menu disappear speed onMouseout (in miliseconds)
var hidemenu_onclick="yes" //hide menu when user clicks within menu?

/////No further editting needed

var ie4=document.all
var ns6=document.getElementById&&!document.all

if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')

function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}


function showhide(obj, e, visible