You want to put the content into "footer"? The easy way is to add an iframe to "footer" and change the src of the iframe on click. See it in action here: http://jsfiddle.net/asgallant/jPXmD/
On Thursday, June 28, 2012 4:27:34 AM UTC-4, Andrea Nelson Mauro wrote: > > mm.. what about linking in parent target like #footer? > > with fancybox it seems not work :))) > > thanky you! > > here the code > > > <!DOCTYPE html> > <html> > <link rel="stylesheet" > href="./jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.css" > type="text/css" media="screen" /> > <script type="text/javascript" src="http://www.google.com/jsapi";></script> > <script type="text/javascript" src=" > http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js";></script> > <script type="text/javascript" > src="./jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.pack.js"></script> > <script type="text/javascript"> > google.load('visualization', '1', {packages: ['geochart']}); > google.setOnLoadCallback(drawVisualization); > > function drawVisualization() { > var data = google.visualization.arrayToDataTable([ > ['State', 'Site'], > ['Alabama', 0], > ['Alaska', 0], > ['American Samoa', 0], > ['Arizona', 1], > ['Arkansas', 0], > ['California', 1], > ['Colorado', 1], > ['Connecticut', 0], > ['Delaware', 0], > ['District of Columbia', 0], > ['Florida', 0], > ['Georgia', 0], > ['Guam', 0], > ['Hawaii', 1], > ['Idaho', 0], > ['Illinois', 0], > ['Indiana', 0], > ['Iowa', 0], > ['Kansas', 0], > ['Kentucky', 0], > ['Louisiana', 0], > ['Maine', 0], > ['Maryland', 1], > ['Massachusetts', 1], > ['Michigan', 0], > ['Minnesota', 0], > ['Mississippi', 0], > ['Missouri', 0], > ['Montana', 0], > ['Nebraska', 0], > ['Nevada', 1], > ['New Hampshire', 0], > ['New Jersey', 1], > ['New Mexico', 0], > ['New York', 1], > ['North Carolina', 0], > ['North Dakota', 0], > ['Northern Marianas Islands', 0], > ['Ohio', 1], > ['Oklahoma', 0], > ['Oregon', 0], > ['Pennsylvania', 1], > ['Puerto Rico', 0], > ['Rhode Island', 0], > ['South Carolina', 0], > ['South Dakota', 0], > ['Tennessee', 0], > ['Texas', 0], > ['Utah', 0], > ['Vermont', 0], > ['Virginia', 0], > ['Virgin Islands', 0], > ['Washington', 0], > ['West Virginia', 0], > ['Wisconsin', 0], > ['Wyoming', 0] > ]); > > var view = new google.visualization.DataView(data); > view.setColumns([0, 1, { > type: 'string', > role: 'tooltip', > calc: function () { > return ''; > } > }]); > > var geochart = new > google.visualization.GeoChart(document.getElementById('visualization')); > var options = {}; > options['region'] = 'US'; > options['resolution'] = 'provinces'; > options['width'] = 400; > options['height'] = 195; > options['colors'] = ['#DDEEF8', '#FADC41']; > options['legend'] = 'none'; > > google.visualization.events.addListener(geochart, 'select', function() > { > var selectionIdx = geochart.getSelection()[0].row; > var stateName = data.getValue(selectionIdx, 0); > var value = data.getValue(selectionIdx, 1); > > if (value == '1') { > $.fancybox('http://seiadev.forumone.com/state-solar-policy/' > + stateName); > } > }); > > geochart.draw(view, options); > } > </script> > > <body> > > > <div id="container" style=";width:500px"> > > <div id="header" style="background-color:#FFA500;"> > <h1 style="margin-bottom:0;">Main Title of Web Page</h1></div> > > <div id="menu" > style="background-color:#FFD700;height:200px;width:100px;float:left;"> > <b>Maps</b><br /> > Map1<br /> > Map2<br /> > Map3</div> > > <div id="visualization" > style="background-color:#EEEEEE;height:200px;width:400px;float:left;"></div> > > <div id="footer" > style="background-color:#FFA500;height:200px;clear:both;text-align:center;"> > Click on the region: the content will appear here</div> > > </div> > > > </body> > </html> > > > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/WOIWtLMecy4J. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.
