2

I've just joined a project where we are using sap netweaver to generate the website.

Until now people have been working on their DCP individually and therefore I now have 20 DCP to link together and style.

At the root, each DCP is an IView/IFrame.

We currently have 20 css files that makes it hard to maintain and quickly change so I'm looking to use scss to generate 1 css file to make everything work.

That part works fine, however I hit a problem, since each IFrame renders itself, each one loads a css file so I get 20 calls to the my new css file.

Is there a way to share the css file between the parent view and the IFrame, or at least set it so that the css file is downloaded once and the other 19 just use the cached version?

Cheers

Jason

Jason Rogers
  • 19,194
  • 27
  • 79
  • 112

1 Answers1

1
<script type="text/javascript">
  $(document).ready(function() {
  //pulling all <style></style> css of parent document
  if (parent) {
        var oHead = document.getElementsByTagName("head")[0];
        var arrStyleSheets = parent.document.getElementsByTagName("style");
        for (var i = 0; i < arrStyleSheets.length; i++)
            oHead.appendChild(arrStyleSheets[i].cloneNode(true));
    }
 //pulling all external style css(<link href="css.css">) of parent document
    $("link[rel=stylesheet]",parent.document).each(function(){
        var cssLink = document.createElement("link")
        cssLink.href = "http://"+parent.document.domain+$(this).attr("href");
        cssLink .rel = "stylesheet";
        cssLink .type = "text/css";
        document.body.appendChild(cssLink);
    });   
  });
</script>

It will able to inherit the css which is defined in the external style sheet as well as css defined in the tag of parent document.

PFK
  • 116
  • 1
  • 1
  • 8
  • Thanks for the answer, I was wandering what you though was better to copy the css through the js, or to load the css file from a shared location? – Jason Rogers May 25 '12 at 09:29
  • it is better to load from the shared location, because in case you updated the css, you don't need to look for it in the js. – PFK May 25 '12 at 11:11