JavaScript - Playing Sound On Mouseclick?

Hello,

I am not the best JS programmer, but I was wondering...

Is there a way to do this:

HTML Document /w/ 2 frames, A & B.

When you click a button in frame A:
"Click" (X,Y coords) in frame B.

If that's not possible in JS, please let me know what language I need.

- Waffles

Hi,

So here is my ordeal. I have an image that when a user clicks, a textarea should show up at the click. I specify textarea style top and left in javascript. On Firefox this works fine, but in Internet Explorer (IE) the textarea is created right before the image instead of on top of the image. It is like that it just ignored the top and left positions.

Also, users can query the database to show all the (mouse clicked) textareas that were created on the image. I coded this using PHP and a bunch of echo's. For some reason, the PHP code works with the CSS styles top and left specified meaning the textareas show up fine on top of the image. But creating a brand new textarea with a mouse click in javascript is not working.

Can someone help me figure out what I'm doing wrong for IE? Thanks!

Here is the javascript (does not work in IE, works in FF):
Code:

function createTextArea(e){
     getMouseCoords(e);//sets posy, posx
     var newDiv= document.createElement("textarea");
     newDiv.setAttribute("name","comment[]");
     newDiv.style.visibility="visible";
     newDiv.style.top= (posy) +'px';
     newDiv.style.left= (posx) +'px';
     newDiv.style.overflow="hidden";
     // append to the document FORM
     var form=getTagFromArray("form","commentform");
     form.appendChild(newDiv);
}

HTML that calls javascript:
Code:

<img id="theImage" src="random.gif" border=1 onclick="createTextarea(event);">

Here is the php when I load the textareas from the database (works in both IE & FF):
Code:

//get data from database
//forloop for each textarea saved in database
echo "<textarea  name=\"comment[]\" style=\"top:".($locy)."px;left:"
.($locx)."px;overflow:hidden;visibility:hidden;\" >".$row['comment']."</textarea>";
//end forloop

I've got this JavaScript code that I'm using to play audio on my site made specifically for iPhones, iPods, and whatnot. However, my only problem is, that I can only pick one audio file to play from, no matter what. Can someone tell me what I'm doing wrong? I really need this specific code cause it allows me to play audio without going into the Media Player on the iPhone and iPod.

Here's what I have in the head section:
Code:

<script type="text/javascript">
        function play_single_sound() {
                        document.getElementById('audiotag').play();
        }
</script>

And the body:
Code:

<div id="audio">
        <audio id="audiotag" src="audio.wav" autobuffer="autobuffer"></audio>
</div>

And now to actually play the audio:
Code:

<a href="javascript:play_single_sound();">Play audio</a>

I can play audio fine, but I'm only limited to one audio file per page. Is there anyway around this??

Hey there guys, i have a client who wants to make a school system on his website, now i've done that, however what my client wants is to put wmv files inside every lesson and he wants to be sure that the user who has registered to the online school WATCHES fully all the wmv and then redirect him to a quiz page where he will take a test.

My client wants to be sure that the users are watching the wmv files before doing any quiz.

SO is there a way where i can know when the wmv file has FINISHED playing so that i would redirect them to another page??

Thank you!

Suppose I have some function ... myFunction();
And I want it to be executed from 3am - 11pm but not at any other time
So far what i had done is along the line of

Code:

for(i=0;i<99999;i++)
{
var time = new Date();
var hours = time.getHours();
if (hours>=3 && hours<=23){
myFunction();
}
}

What happens so far is that:

If it is the right time it loops over and over and continually executes the function (which is what I want)

If it's the wrong time (not 3am-11pm) it loops once, doesn't execute the functoin and then the script finishes (whereas I want it to continue looping until the right time comes along)

If its the right time and then it moves to the wrong time it stops looping, whereas i want it to not execute the function but continue looping until the right time comes around again.


So the overall affect is that at the given times of day the script plays and when its not the correct time it doesnt and then when it is the right time again it starts playing again, seemlessly and continually

Hi, I need some help with playing sounds with javascript.

What I need:
When the user clicks the button it will run the function and play a sound either from the source or embedded into the website(which ever way works).

Thanks alot!

How could I make it so that instead of seeing a embed object you would just see a input button that says play. I do not need my users to be able to pause them. I really didn't know where to start with the javascript but i do have the html5

Code:

<audio controls="controls">
  <source src="BlackHawkDown-MusicVideo-Frontline.wav" type="audio/wav" />
  <source src="BlackHawkDown-MusicVideo-Frontline.mp3" type="audio/mpeg" />
  Your browser does not support the audio element.
</audio>

THANKS!!!!

Our website normally plays music onload that can be stopped when manually starting a video using onclick="stop1()".

I've manipulated a javascript that detects if the user is a new or return user and plays the video automatically in a popup if the user is new. But, I cannot figure out how to either stop the music or prevent the music from starting at the same time.

I've really got no experience with js and am fumbling my way around. would appreciate your help.

I have a simple mobile app designed using PhoneGap. I am some mp3 in it and I am using the Media plugin of PhoneGap. Everything is working fine, the audio is playing and so on.

The issue, I noticed after playing 8-12 times, the audio stops playing. I do not get sound. Here are my codes:

Code:

<script>
    document.addEventListener("deviceready", onDeviceReady, false);
    function onDeviceReady() {}

    // Audio player
    var media = null;
    var audioP = false;

    // Play audio
    function playAudio(src) {
        if (audioP === false) {
        media = new Media(src, onSuccess, onError);
        media.play();
        audioP = true;

    } else {
        media.release();
        }
    }

    // onSuccess Callback
    function onSuccess() {
        console.log("playAudio():Audio Success");
        audioP = false;
    }

    // onError Callback
    function onError(error) {}      
    </script>

Help!

Hi there,

Not sure what sub category this falls under sorry, but I have an issue changing a table based menu to a css based menu.

This has been done however the javascript code no only partly works, I would like for it to completely work and am not sure whether I should use aspanel or <div> tags to get it to work as I have tried both and neather seem to work so there is something i am obviously missing!

here is the javascript:
Code:

$(function() {
    $('#mainCategories a').live('click', function() {
        $.ajax({
            type: "GET",
            contentType: "text/html; charset=utf-8",
            dataType: "html",
            url: "/ajax/menu.aspx?CategoryId=" + this.name,
            cache: false,
            success: function(newMenu) {
                $("#left-menu-control").replaceWith(newMenu);
                $('html, body').animate({ scrollTop: 0 }, 'slow');
            }
        });
        return false;
    });

    $('#left-menu-collapse-category').live('click', function() {
    $.ajax({
        type: "GET",
        contentType: "text/html; charset=utf-8",
        dataType: "html",
        url: "/ajax/menu.aspx",
        cache: false,
        success: function(newMenu) {
            $("#left-menu-control").replaceWith(newMenu);
        }
    });
    return false;
    });
});

and here is the page code:
Code:

<div id="menu-left">

<asp:Panel ID="pnlLeftMenuControl" runat="server">
	
	<asp:Panel ID="pnlCategories" runat="server">
			
			<asp:Panel ID="pnlCurrentlyViewing1" runat="server" Visible="false">
				<div id="menu-left-main-categories">
				<div id="menu-left-currently-viewing-title">Currently Viewing...</div>
				<div id="menu-left-currently-viewing-close"><a href="javascript:void(0);" title="Collapse category" id="left-menu-collapse-category"><img src="~/images/button-menu-left-currently-viewing-close.jpg" runat="server" border="0" /></a></div>
				</div>
			</asp:Panel>
		
			<asp:Panel ID="pnlCurrentlyViewing2" runat="server" Visible="false">
				<div id="menu-left-currently-viewing">
				<div id="menu-left-currently-viewing-text"><asp:Hyperlink ID="hlCategory" runat="server" CssClass="left-menu-viewing"></asp:Hyperlink></div>
				</div>
			</asp:Panel>
		
			<asp:Panel ID="pnlSubCategories1" runat="server" Visible="false">
				<asp:Repeater ID="rptSubCategories" runat="Server">
					<ItemTemplate>
						<div id="menu-left-currently-viewing">
						<div id="menu-left-currently-viewing-text">- <asp:HyperLink ID="hlSubCategory" runat="server" CssClass="left-menu-viewing"></asp:HyperLink></div>
						</div>
					</ItemTemplate>
				</asp:Repeater>
			</asp:Panel>
			
			<asp:Panel ID="pnlMainCategories" runat="server">
				<asp:Repeater ID="rptMainCategories" runat="server">
					<ItemTemplate>
					<div id="menu-left-main-categories"><div id="menu-left-main-categories-text"><asp:HyperLink ID="hlCategory" runat="server" CssClass="left-menu"></asp:HyperLink></div></div>
					</ItemTemplate>                
				  </asp:Repeater>
			</asp:Panel>
			
		</asp:Panel>
      
	<asp:Panel ID="pnlBrands" runat="server" Visible="false">
		
		<asp:Panel ID="pnlBCurrentlyViewing1" runat="server" Visible="false">
			Currently viewing...
		</asp:Panel>
		
		<asp:Panel ID="pnlBCurrentlyViewing2" runat="server" Visible="false">
			<asp:Label ID="lblBCurrentlyViewing" runat="server" CssClass="left-menu-viewing"></asp:Label>
		</asp:Panel>
	
		<asp:Repeater ID="rptBrands" runat="server">
			<ItemTemplate>
				<asp:HyperLink ID="hlBrand" runat="server" CssClass="left-menu"></asp:HyperLink>
			</ItemTemplate>                
		</asp:Repeater>
		
	</asp:Panel>
	  
</asp:Panel>
</div>

any help would be greatly appreciated

I want to use HTML5's audio coding similar to the one below:

Code:

var audioElement = document.createElement('audio');
audioElement.setAttribute('src', 'horse.ogg');
audioElement.play();

In order to play sound files depending on the input. What I'm working on is a text-to-speech webapplication.

What I'd need to happen is for there to be an input and then allow the user to type anything into the input, so if they type in:

Hello, how are you doing?

Javascript or PHP will recognize each character and translate it into an audio sequence.

In example:

It'd detect the "H" in hello and play sound file "H.ogg"
It'd then detect the "E" in hello and play sound file "E.ogg"

I know there must be an easy way to do this.

I am using this fancy box code to smoothly pop up an image on click, I got it working on my main index page but that's not where I want to put it. My site has a menu where it loads webpages inside the main index one, I would like to use the code on one of those pages but something is not working.

I am not able to use the specified DOCTYPE but find that it works all the same with my current one, however if I use the given one in addition to the one I have now (and need) then my site does not work properly, further if I replace it I get the same results.

My existing doctype:

Code:

<DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"
			"http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd"
			"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

What the code uses:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

I'm not sure what the differences are but I've been advised that I need to run the code in "standards mode" before I try to fix it. As I see it the code works, just not where I need it to, nothing unusual on my site and nothing unusual that I may be wrong.

On my site you can see at the bottom right a blue text link called "aaaa" this is the code that works, however (clicking the dome to the left of that to scroll the page down and selecting the "met.a has guts" menu option diagram) you'll see the "aaaa" link again at the bottom left of that page and that is where I need it to work from.

I even tried using the exact code from the example in that linked .htm page but it doesn't make a difference, it probably even hinders the code as it looks at the main html page. But if loading the page on its own the code will work, so its related to the menu and the way that works.


If anybody can help that would be brilliant, I'm sure its something simple.

Thanks!

hi I am trying to play a video from youtube. What I have done so far is getting videos from my database and displaying all those videos thumbnails. So now what i want is to when i click any thumbnail it should play that video in my website. How can I do this?

Here is my code
Code:

function showResult(result) {
        $('#videosLoader').css('display','none');
            var videoId = result.split(" ");
            for(i = 0; i < videoId.length - 1; i++) {
            var vidId = $.trim(videoId[i]);
            vidLink = getScreen(vidId,"small");
            $('#videosList').append("<div class='playVid'>" + 
                                        "<img width=80 height=80 src=" + vidLink + " alt='' /> " + 
                                        "<input type='hidden' name='vidId' value='" + vidId + "' />" + 
                                    "</div>").addClass("playVid");
    }
    
    $('.playVid').click(function() {
        var val = $("input[name='vidId']").val();
        alert("val");
        $("#haveYourDefinition").append("<embed src='http://www.youtube.com/v/" + val + "&rel=1' pluginspage='http://adobe.com/go/getflashplayer' type='application/x-shockwave-flash' quality='high' width='450' height='376' bgcolor='#ffffff' loop='false'></embed>");
    });

When I click any thumbnail it does nothing. Why and please tell me how to do this? Help

Hello
I am in need of help desperatley. I am trying to get a video to launch from my homepage. see test homepage here http://www.nuviewinc.com/index3.html
the video should pop up and play.
Like it does here- http://www.nuviewinc.com/testv.html

But it doesnt...

can anyone help this poor marketing manager with coding?

I simply followed the directions here http://www.vmatrixonline.com/vplayer...structions.pdf.

all the code appears correct.

Hey guys, first I am new and I don't really know where this goes but I am wanting some help with developing a program that converts Sound (Speech or more preferably a sound... Like a frequency) to a Keystroke or code.. I know a little bit of C++ if that helps.. (I also Have Visual Studio 2013) Thanks guys





Reply With Quote




12-21-2014, 12:36 PM #2
Philip M View Profile View Forum Posts

Supreme Master coder! Join Date Jun 2002 Location London, England Posts 18,371 Thanks 204 Thanked 2,573 Times in 2,551 Posts

Not possible using Javascript.

The Warrington players can hang their heads high. - Commentator, BBC Radio 2