YUI Library JavaScript DHTML


            



    
Getting Content from an External Source

/*margin and padding on body element
  can introduce errors in determining
  element position and are not recommended;
  we turn them off as a foundation for YUI
  CSS treatments. */
body {
  margin:0;
  padding:0;
}









.yui-navset div.loading div {
    background:url(yui_2.7.0b-assets/tabview-assets/loading.gif) no-repeat center center;
    height:8em; /* hold some space while loading */
}
#example-canvas h2 {padding: 0 0 .5em 0;}




Getting Content from an External Source


  This demonstrates how to load Tab content from an external data source.



Browser News



(function() {
    var tabView = new YAHOO.widget.TabView();
    
    tabView.addTab( new YAHOO.widget.Tab({
        label: 'Opera',
        dataSrc: 'yui_2.7.0b-assets/tabview-assets/news.php?query=opera+browser',
        cacheData: true,
        active: true
    }));
    tabView.addTab( new YAHOO.widget.Tab({
        label: 'Firefox',
        dataSrc: 'yui_2.7.0b-assets/tabview-assets/news.php?query=firefox+browser',
        cacheData: true
    }));
    tabView.addTab( new YAHOO.widget.Tab({
        label: 'Explorer',
        dataSrc: 'yui_2.7.0b-assets/tabview-assets/news.php?query=microsoft+explorer+browser',
        cacheData: true
    }));
    tabView.addTab( new YAHOO.widget.Tab({
        label: 'Safari',
        dataSrc: 'yui_2.7.0b-assets/tabview-assets/news.php?query=apple+safari+browser',
        cacheData: true
    }));
    YAHOO.log("The example has finished loading; as you interact with it, you'll see log messages appearing here.", "info", "example");
    tabView.appendTo('container');
})();





   
   
yui_2.7.0b.zip( 4,431 k)