Results 1 to 2 of 2

Thread: dynamic content stip css.....why?

  1. #1
    Join Date
    Sep 2007
    Posts
    110
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default dynamic content stip css.....why?

    http://www.dynamicdrive.com/dynamici...jaxcontent.htm


    Im trying to get this script to work for me and what im trying to figure out is why when i link to an outside site IE: google.com it strips all the css that the page has. can anyone tell me why this is? I have some cleanup to do in the code but still works just cant figure the css thing out. any help please

    here is the code:

    HTML Code:
    <html>
    <head>
    <style type="text/css">
    
    /*Credits: Dynamic Drive CSS Library */
    /*URL: http://www.dynamicdrive.com/style/ */
        
    #glowingtabs{
    float:left;
    width:100%;
    font-size:90%;
    line-height:normal;
    border-bottom: 1px solid #7e9fff; /*Add border strip to bottom of menu*/
    }
    
    #glowingtabs ul{
    list-style-type: none;
    margin:0;
    margin-left: 5px; /*Left offset of entire tab menu relative to page*/
    padding:0;
    }
    
    #glowingtabs li{
    display:inline;
    margin:0;
    padding:0;
    }
    
    #glowingtabs a{
    float:left;
    background:url(media/glowtab-left.gif) no-repeat left top;
    margin:0;
    margin-right: 5px; /*spacing between each tab*/
    padding:0 0 0 9px;
    text-decoration:none;
    }
    
    #glowingtabs a span{
    float:left;
    display:block;
    background:url(media/glowtab.gif) no-repeat right top;
    padding: 4px 12px 2px 3px;
    font-weight:bold;
    color:#3B3B3B;
    }
    
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #glowingtabs a span {float:none;}
    /* End IE5-Mac hack */
    
    #glowingtabs a:hover span {
    color: black;
    }
    
    #glowingtabs #current a{ /*Selected Tab style*/
    background-position:0 -82px; /*Shift background image up to start of 2nd tab image*/
    }
    
    #glowingtabs #current a span{ /*Selected Tab style*/
    background-position:100% -82px; /*Shift background image up to start of 2nd tab image*/
    color: black;
    }
    
    #glowingtabs a:hover{ /*onMouseover style*/
    background-position:0% -82px; /*Shift background image up to start of 2nd tab image*/
    }
    
    #glowingtabs a:hover span{ /*onMouseover style*/
    background-position:100% -82px; /*Shift background image up to start of 2nd tab image*/
    }
    
    </style>
    
    <!--[if IE]>
    <style type="text/css">
    p.iepara{ /*Conditional CSS- For IE (inc IE7), create 1em spacing between menu and paragraph that follows*/
    padding-top: 1em;
    }
    </style>
    <![endif]-->
    
    
    
    
    
    
    
    
    
    
    
    
    <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 loadedobjects=""
    var rootdomain="http://"+window.location.hostname
    
    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)
    }
    page_request.open('GET', url, 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
    }
    
    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">
    #leftcolumn{
    float:left;
    width:150px;
    height: 400px;
    border: 3px solid black;
    padding: 5px;
    padding-left: 8px;
    
    }
    
    #leftcolumn a{
    padding: 3px 1px;
    display: block;
    width: 100%;
    text-decoration: none;
    font-weight: bold;
    border-bottom: 1px solid gray;
    }
    
    #leftcolumn a:hover{
    background-color: #FFFF80;
    }
    
    #rightcolumn{
    width:900px;
    overflow: auto;
    height: 400px;
    border: 1px solid black;
    }
    
    
    
    * html #rightcolumn{ /*IE only style*/
    height: 400px;
    }
    </style>
    
    
    
    </head>
    
    <body>
    <div id="glowingtabs">
    <ul>
    <li><a href="javascript:ajaxpage('http://www.google.com', 'rightcolumn'); ajaxpage('http://www.cnn.com', 'rightcolumn2');"><span>Home</span></a></li>
    <li id="current"><a href="javascript:ajaxpage('ajaxfiles/external.htm', 'rightcolumn');"><span>CSS Codes</span></a></li>
    <li><a href="javascript:ajaxpage('ajaxfiles/external.htm', 'rightcolumn');"><span>Forums</span></a></li>
    <li><a href="javascript:ajaxpage('ajaxfiles/external.htm', 'rightcolumn');"><span>Tools</span></a></li>
    <li><a href="javascript:ajaxpage('ajaxfiles/external.htm', 'rightcolumn');"><span>JavaScript</span></a></li>
    </ul>
    </div><br><br>
    <br style="clear: left;" />
    <center>
    
    <div id="rightcolumn">column one</div>
    <div style="clear: left; margin-bottom: 1em"></div>
    
    
    
    
    
    
    
    
    
    
    </body>
    </html>
    

  2. #2
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    duplicate post... mod please remove

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •