I have downloaded a flash component "Fade In Fade Out Slideshow".and included my images in it. I don't know how to include it in drupal
its index.html page is
<html xmlns="http`enter code here`://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>XML Banner Rotator</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript">
// JAVASCRIPT VARS
// cache buster
var cacheBuster = "?t=" + Date.parse(new Date());
// stage dimensions
var stageW = "560";//"100%";
var stageH = "374";//"100%";
// ATTRIBUTES
var attributes = {};
attributes.id = 'FlabellComponent';
attributes.name = 'FlabellComponent';
// PARAMS
var params = {};
params.bgcolor = "#ffffff";
params.menu = "false";
params.scale = 'noScale';
params.wmode = "opaque";
params.allowfullscreen = "true";
params.allowScriptAccess = "always";
/* FLASH VARS */
var flashvars = {};
/// if commented / delete these lines, the component will take the stage dimensions defined
/// above in "JAVASCRIPT SECTIONS" section or those defined in the settings xml
flashvars.componentWidth = stageW;
flashvars.componentHeight = stageH;
/// path to the content folder(where the xml files, images or video are nested)
/// if you want to use absolute paths(like "http://domain.com/images/....") then leave it empty("")
flashvars.pathToFiles = "banner/";
// path to content XML
flashvars.xmlPath = "xml/banner.xml";
/** EMBED THE SWF**/
swfobject.embedSWF("preview.swf"+cacheBuster, attributes.id, stageW, stageH, "9.0.124", "js/expressInstall.swf", flashvars, params, attributes);
</script>
<table width="100%" height="100%" cellpadding="0" cellspacing="0">
<td align="center">
<!-- this div will be overwritten by SWF object -->
<div id="FlabellComponent">
<p>In order to view this object you need Flash Player 9+ support!</p>
<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player"/>
</a>
</div>
</td>
</table>
</body>
</html>
i have downloaded a flash component "Fade In Fade Out Slideshow".and included mu images in it.i don't know how to include it in drupal
any idea????
i tried to embed its preview.swf using the below code..but flash image doesn't displays.
<div id="swfhead">
<object height="205" width="950">
<param value="preview.swf" name="movie">
<embed height="205" width="950" src="preview.swf">
</object>
</div>
You cant embed swf as you did. Please refer theme concepts in drupal.org
Bio : http://drupal.org/user/1313260
Related
I have divided my html-file into a header.php, content.php and footer.php
I would like to load the js files and the document.getready function either in the hader or in the footer file. But I got an error saying: Uncaught ReferenceError: $ is not defined.
In my header.php I load the following scripts in the head section:
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js" async></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.2.5/jquery.fancybox.js" async></script>`
And in my Footer after the closing </body>-Tag I call:
<script>
$(document).ready(function() {
if( !window.isCMS) {
// Group images by gallery using data-fancybox-group attributes
var galleryId = 1;
$('.editable-gallery').each( function() {
$(this).find('a').attr('data-fancybox', 'gallery-' + galleryId++);
});
$('.editable-gallery').each( function() {
$(this).find('img').attr('width', '200');
});
// Initialize Fancybox
$("[data-fancybox]").fancybox({
// Use the alt attribute for captions per http://fancyapps.com/fancybox/#useful
//beforeShow: function() {
// var alt = this.element.find('img').attr('alt');
//this.inner.find('img').attr('alt', alt);
//this.title = alt;
//}
});
}
});
</script>
In my content.php file I include my header.php and footer.php like this:
<?php include ("header.php"); ?>
<?php include ("footer.php"); ?>
How and where do I have to implement the script files and the document.getready function?
This is my Gallery Code in my content.php:
<div id="my-gallery" class="editable-gallery">
<img src="fotos/2018/rl/02022018/3.jpg" alt="">
<img src="fotos/2018/rl/02022018/1.jpg" alt="">
<img src="fotos/2018/rl/02022018/3.jpg" alt="">
</div>
I have to add the attr "data-fancybox" and "width" to work with fancybox.
1st:- The error comes from src="http://code.jquery.com/jquery-latest.min.js" it should be https instead of http >> src="https://code.jquery.com/jquery-latest.min.js"
2nd:- you can include js files or js code in <head> OR BEFORE </body>
3rd:- you can use <script></script> anywhere from <head> to </body> even before the line you including your jquery BUT use $(document).ready(function(){ //code here })
Note: if you have any plugins you must include the plugins after including jquery
your js code works fine
$(document).ready(function() {
//if( !window.isCMS) {
// Group images by gallery using data-fancybox-group attributes
var galleryId = 1;
$('.editable-gallery').each( function() {
$(this).find('a')
.attr('data-fancybox', 'gallery-' + galleryId++).find('img').attr('width' , '200');
});
// Initialize Fancybox
$("[data-fancybox]").fancybox({
// Use the alt attribute for captions per http://fancyapps.com/fancybox/#useful
//beforeShow: function() {
// var alt = this.element.find('img').attr('alt');
//this.inner.find('img').attr('alt', alt);
//this.title = alt;
//}
});
//}
});
<!-- 1. Add latest jQuery and fancyBox files -->
<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.2.5/jquery.fancybox.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.2.5/jquery.fancybox.min.js"></script>
<!-- 2. Create links -->
<div id="my-gallery" class="editable-gallery">
<img src="http://via.placeholder.com/350x150" alt="">
<img src="http://via.placeholder.com/350x150" alt="">
<img src="http://via.placeholder.com/350x150" alt="">
</div>
<!-- 3. Have fun! -->
I have downloaded a note taking app (PHP/css+jquery) and I wanted to hide the div that contains the note pad. I don't know why, but what I write in the js file doesn't affect the site.
This is the js file. Everything works fine, but when I wrote the second line it didn't hide the div at all.
$(function(){
$('#pad').hide();
var note = $('#note');
var saveTimer,
lineHeight = parseInt(note.css('line-height')),
minHeight = parseInt(note.css('min-height')),
lastHeight = minHeight,
newHeight = 0,
newLines = 0;
var countLinesRegex = new RegExp('/n', 'g');
note.on('input', function(e){
clearTimeout(saveTimer);
saveTimer = setTimeout(ajaxSaveNote, 2000);
newLines = note.val().match(countLinesRegex);
if(!newLines) {
newLines = [];
}
newHeight = Math.max((newLines.length + 1)*lineHeight, minHeight);
if(newHeight != lastHeight){
note.height(newHeight);
lastHeight = newHeight;
}
}).trigger('input');
function ajaxSaveNote(){
$.post('index.php', { 'note' : note.val() });
}
});
Here is the PHP:
<?php
$note_name = 'note.txt';
$uniqueNotePerIP = false;
if($uniqueNotePerIP){
// Use the user's IP as the name of the note.
// This is useful when you have many people
// using the app simultaneously.
if(isset($_SERVER['HTTP_X_FORWARDED_FOR'])){
$note_name = 'notes/'.md5($_SERVER['HTTP_X_FORWARDED_FOR']).'.txt';
}
else{
$note_name = 'notes/'.md5($_SERVER['REMOTE_ADDR']).'.txt';
}
}
if(isset($_SERVER['HTTP_X_REQUESTED_WITH'])){
// This is an AJAX request
if(isset($_POST['note'])){
// Write the file to disk
file_put_contents($note_name, $_POST['note']);
echo '{"saved":1}';
}
exit;
}
$note_content = '
Write your note here.
It will be saved with AJAX.';
if( file_exists($note_name) ){
$note_content = htmlspecialchars( file_get_contents($note_name) );
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Devoirs Communs</title>
<!-- Our stylesheet -->
<link rel="stylesheet" href="assets/css/styles.css" />
<!-- A custom google handwriting font -->
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Courgette" />
<script src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<input type="text">
<input type="button">
<div id="pad">
<h2>Note</h2>
<textarea id="note"><?php echo $note_content ?></textarea>
</div>
<footer>
</footer>
<!-- JavaScript includes. -->
<script src="assets/js/script.js"></script>
</body>
</html>
Your REGEXP is wrong.
You need to change this line:
var countLinesRegex = new RegExp('\\n', 'g');
But this is not the only problem. Follow it:
1 - You start hidding the #pad element, and I couldn't see in your code where do you show it again:
$('#pad').hide();
2 - You can't get line height this way. It will return undefined if there's no line-height attribute. Same for min-height:
parseInt(note.css('line-height'))
your should use some plugin to get this behavior the way you want.
3 - And suppose item 2 returned the line-height rightly, it would return something like "10px", or worst, "1.2em". And when you tried to do some math with it, you will get an error or maybe strip unit measures from it.
index.html
<html>
<head>
<script type="text/javascript" src = "jquery-1.10.1.js"></script>
<script type="text/javascript" language = "javascript">
function swapContent(cv)
{
$_("#myDiv").html("Put animated .gif here").show();
var url= "myphpscript.php";
$_post(url,{contentVar:cv},function(data){
$_("#myDiv").html(data).show();
});
}
</script>
</head>
<body>
Content1 •
Content2 •
Content3 •
<div id = "myDiv"> My Default Content 1</div>
</body>
</html>
myphpscript.php
<html>
<body>
<?php
$_contentVar = $_POST['contentVar'];
if($_contentVar == 'Con1')
{
echo ' My Defaut Content';
}
else if($contentVar == 'Con2')
{
echo ' My Defaut Content 2';
}
else if($contentVar == 'Con3')
{
echo ' My Defaut Content 3';
}
?>
</body>
</html>
I am trying to display some dynamic content when the onmousedown event is done. I haven't done the animation yet, but just I wanted to get the required divs to be changed on choosing the different links but some how it doesn't seem to work.The jQuery file has been correctly loaded.
COndition wrong
$_contentVar = $_POST['contentVar'];
if( $_contentVar == 'Con1') //here you are using $contentVa not $_contentVar
I'm not sure why you have used _ in $_("#myDiv").. I think your javascript code should be
function swapContent(cv)
{
$("#myDiv").html("Put animated .gif here").show();
var url= "myphpscript.php";
$.post(url,{contentVar:cv},function(data){
$("#myDiv").html(data).show();
});
}
and also another problem I see is with how you call the function it should be javascript:swapContent('Con1') not javascript.swapContent('Con1'). You have put '.' instead of ':'
so the links should be
Content1 •
Content2 •
Content3 •
You should also change the variable name in PHP script, which I hope you already knew
here is my working fusion chart code:
<?php
include("FusionCharts/FusionCharts.php");
?>
<HTML>
<HEAD>
<TITLE>
FusionCharts - Array Example using Single Series Column 3D Chart
</TITLE>
<SCRIPT LANGUAGE="Javascript" SRC="FusionCharts/FusionCharts.js"></SCRIPT>
<script type="text/javascript" LANGUAGE="Javascript" SRC="FusionCharts/jquery.min.js"></script>
<script type="text/javascript" LANGUAGE="Javascript" SRC="FusionCharts/lib.js"></script>
<link href="FusionCharts/style.css" rel="stylesheet" type="text/css" />
</HEAD>
<BODY>
<CENTER>
<h2>FusionCharts Examples</h2>
<h4>Plotting single series chart from data contained in Array.</h4>
<?php
//Now, we need to convert this data into XML. We convert using string concatenation.
//Initialize <chart> element
$strXML = "<chart caption='Exam result for CSC113A ' numberPrefix='' formatNumberScale='10' xAxisName='Grades' yAxisName='No Of Students' bgColor='995699,FEEFFF' exportEnabled='1' exportAtClient='0' exportAction='download' exportShowMenuItem='1'>";
//Convert data to XML and append
$strXML .= "<set label='L' value='10'/><set label='Y' value='40'/></chart>";//Comment this line of code to render the data from your database. This line of code is only for testing purpose
//Un-comment the below line of code to render the chart in pure JavaScript forcefully.
FC_SetRenderer('javascript');
//Create the chart - Column 3D Chart with data contained in strXML
echo renderChart("FusionCharts/Column3D.swf", "", $strXML, "myChart", 600, 300, false, true);
?>
</CENTER>
</BODY>
</HTML>
Out Put of this code :
default export button image :
I want to add this kind of buttons to my chart :
here default export button is too small.I want to change size of this button.and also want add print icon to this graph....where I can put export button properties to my code???How can I do it????Need ur great help...Thankzz in advanced..
Demo live code: click here
i have found a method..this is code :
<?php
include("FusionCharts/FusionCharts.php");
//include("FusionCharts/ExportHandlers/PHP/FCExporter.php");
?>
<html>
<head>
<title>
FusionCharts - Array Example using Single Series Column 3D Chart
</title>
<script type="text/Javascript" SRC="FusionCharts/FusionCharts.js"></script>
<script type="text/javascript" LANGUAGE="Javascript" SRC="FusionCharts/jquery.min.js"></script>
<style type= "text/css" >
.div1 {
height:360px;
width:650px;
background:#FFF0FF;
background-repeat:no-repeat;
border:2px solid #995699;
}
.div2 {
height:35px;
width:105px;
background:#FFF0FF;
background-repeat:no-repeat;
}
</style>
<script type="text/Javascript" >
function callPrint(){
window.print();
}
function callExport(val){
var chartObject = FusionCharts('myChart');
if( chartObject.hasRendered() )
{
if(val==1){
chartObject.exportChart({ exportAtClient:'1',exportFormat:'PNG'});
}
else{
chartObject.exportChart({ exportAtClient:'1',exportFormat:'PDF'});
}
}
}
</script>
</head>
<body>
<center>
<h2>FusionCharts Examples</h2>
<h4>Plotting single series chart from data contained in Array.</h4>
<div class="div1">
<div class="div2" align="right">
<p align="right"><img width='32' height='32' title='Click To Download as Image' src='FusionCharts/png_32.PNG' border='0'>
<img width='32' height='32' title='Click To Download as PDF Doc' src='FusionCharts/pdf_32.png' border='0'>
<a href='#' onclick='callPrint();'><img width='30' height='30' title='Click To Print The Chart' src='FusionCharts/Printer.png' border='0'></a></p>
</div>
<?php
//Now, we need to convert this data into XML. We convert using string concatenation.
//Initialize <chart> element
$strXML = "<chart caption='Exam result for CSC113A ' numberPrefix='' formatNumberScale='10' xAxisName='Grades' yAxisName='No Of Students' bgColor='FFFFCC,FFFFCC' exportEnabled='1' exportAtClient='0' exportAction='download' exportShowMenuItem='0' exportFormats='JPG=Download as JPEG|PDF=Download as SVG'>";
//Convert data to XML and append
$strXML .= "<set label='L' value='10'/></chart>";//Comment this line of code to render the data from your database. This line of code is only for testing purpose
//Un-comment the below line of code to render the chart in pure JavaScript forcefully.
FC_SetRenderer('javascript');
//Create the chart - Column 3D Chart with data contained in strXML
echo renderChart("FusionCharts/Column3D.swf", "", $strXML, "myChart", 600, 300, false, true);
?>
</div>
</center>
</body>
</html>
out put of this code :
here u can see the print,png & pdf icons are placed at the top.when I click those icons callExport() function called & generate the relevant out put..This what I want....this code will help to others...try to use it..thanks so much...
Can anyone explain how to embed a swf object into a facebook canvas page via PHP.
<?php
function sswf($swf,$swfh,$swfw) {
echo "<OBJECT classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000'
codebase='http://active.macromedia.com/flash2/cabs/swflash.cab#version=4,0,0,0' ID=objects WIDTH=$swfw HEIGHT=$swfh><PARAM
NAME=movie VALUE='$swf'><EMBED src='$swf' WIDTH=$swfw HEIGHT=$swfh TYPE='application/x-shockwave-flash'
PLUGINSPAGE='http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash'></OBJECT>";
}
$mf = "mmmm1.swf";
sswf($mf,690,1000);
?>
The code above no longer works although it did last week.... What's wrong with it?
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
var params = {allowFullScreen:'false', allowscriptaccess:'always', wmode:'opaque'};
var flashvars = {};
var attributes = { name:"xxx", id:"xxx" };
swfobject.embedSWF("xxx.swf?<? echo(time()) ?>", "xxx", "520", "500", "9.0", null, flashvars, params, attributes);
</script>
<div id="fb-root"></div>
<div id="xxx">
<h1>You need at least Flash Player 9 to view this page.</h1>
<p><img src="https://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></p>
</div>