|
JavaScript - Changing <video> Source With Two Methods, None Works
Ok, from the beginning. I have written a HTML5 player with controls and stuff. But I have one problem. After using switch-to-HD option the controls (like full screen) stops working. And in Firebug I see strange behaviour when switching back from HD (press HD, let it load and press HD again) - it seem like every event is triggered two times, and then more and more. What can I do with all of it? And it seems that there is a 'ghost' of the player that was before, cause it still plays when I switch to HD.
The player is he http://secondgate.pl/temporary/nttp/ I also tried differend method for switching the source, using .load(). But it seems that Firefox can't load the movie after that and Chrome sets the volume to 100%, so it didn't work either. The player from this method is he http://secondgate.pl/temporary/tpp_004/ I would be mostly grateful for help. I know it's a lot of code, but it's all commented. I have no idea what am I doing wrong and I'm sitting like a week in front of it. Similar TutorialsDear all, I am trying to set up a web site for an art gallery. That is for new talents so I have no budget. I am not a web designer and I am facing some barriers. Maybe some of you could help me. My problem is, I guess, about going around with the DOM node tree. My page looks like this: FRAME 1 - Header FRAME 2 - Navigation bar FRAME 3 - Has arrows for scrolling iframe 3.1 ---- iframe 3.1 - has thumbnails FRAME 4 - First for query and after shows the enlarged pictures of thumbnails FRAME 5 - Has arrows for scrolling iframe 5.1 ---iframe 5.1 Has text explaining pictures in frame 4 How it works: In first place, after page has been loaded, I am using frame 4 to run a HTML form. After submit, iframe 3.1 is populated with thumbnails according to the query. When a thumbnail is clicked, I succeeded in bringing the corresponding text, talking about the artwork, on iframe 5.1 to do so, I change the html source in iframe 5.1 I am using for that: top.frames['frame5_id'].document.getElementById('iframe 5.1_id').src=new_source.html; The idea was about doing the same with the frame 4 that is for a larger picture of the artwork. But first I need to get rid of the form once it was submitted (bring a new HTML with a dummy transparent gif to be swapped with the desired picture). But how can I bring a new html in frame 4? After the form is submitted the 'action' moves to iframe 3.1 I tried changing the html source using getElementById but I could not find a way to get to the right object. So my questions a Two src attibutes must be changed with code written in iframe 3.1. (where the thumbnails are clicked). But... How can I address and change the HTML src code in FRAME 4 ? How can I address and change the src image in the new code loaded in FRAME 4 ? I have both attributes in variables but don't know how to get to the target elements Thanks for any help. regards, wagner I am looking for an input text that links to a iframe. . ? To begin, we need some simple HTML elements: A basic form; An Input text that will contain the URLs we want to use; An iFrame that will display the page we select from the input text. Thanks in advance Stickers Ok, 'nother head-banger for the hardcore! I have a "contact us" <a> with the id 'contact' on the main page, which is supposed to change the source file of an iframe to the contact page. Except when I click on "contact us" nothing happens. I've tried to get this to work several different ways, and suspect that the problem is purely syntax, but I just haven't been able to figure it out. Here's the code: The snippet on the main page (index.html): Code:
<div id="linkListContact" class="LinkList">
<img id="linkListContactBg" class="SideBarBgImg" src="Assets/Backgrounds/SideBar/ContactBg.png"></img>
<span>
<ul>
<li>
<div><a id="contact">Contact Us</a>
</div>
</li>
</ul>
</span>
</div>
... and the relevant Javascript: Code:
function setIFrame(frameSource)
{
document.getElementById('mainWindow').src = frameSource;
}
function setContactLink()
{
var contactURL = "http://katabasis.spreadshirt.com/shop/imprint"
document.getElementById('contact').onclick = new Function ( "setIFrame( 'contactURL' )" );
}
The setIFrame function is used to call the content initially when the page loads, and is working beautifully in that context. You can see the problem in action at the actual site: www.katabasis-apparel.com. Thanks. I HAVE BEEN TRYING TO FIGURE OUT THE PARAMETERS IN THE FUNCTIONS, INCLUDING THE ARRAYS [i], [p], ["get_" + i], ["set_" + i] AND HOW THE METHODS ARE BEING CALLED IN RELATION TO i, p and val, so that I can make sense of this code. If possible can you explain the code also What I will like to know are the properties and methods of the objects generated in the following code? Also I want to know how I can use those methods to show and change the name and age for the emp2 object. this is the code: function Employee(properties) { for (var i in properties) { if (properties.hasOwnProperty(i) && typeof properties[i] != 'function') { this["get_"+i] = (function(p) { return function() { return properties[p]; }; })(i); this["set_"+i] = (function(p) { return function(val) { properties[p] = val; }; })(i); } } } var emp1 = new Employee({ name: "Bob", age: 35, foo: function() {} }); var emp2 = new Employee({ name: "Gary", age: 54 }); Hey all, 1) When clicking on a list in an accordion, it should change the quicktime movie playing in a main window area. It works in firefox but not in safari. The variable imgTitle holds the expected output (e.g. '../images/Intro-1.mov'). It changes the src attribute of the embed tag. This change works in Firefox where the new movie plays on click. However, when clicking the list item in safari, nothing happens. 2) There is a problem in firefox as well in that the movie overlays everything else on page, even though it should be behind the text. Positioning would be tedious given that there's many nested elements and I would have to set relative positioning to the entire page. Any reason for this behavior of embed tags? Code: $(".image_thumb ul li ul li").click(function(){
var imgTitle = $(this).find('a').attr("href");
var imgDesc = $(this).find('.block').html();
var imgDescHeight = $(".main_image").find('.block').height();
if ($(this).is(".active")) {
return false;
} else {
console.log(imgTitle);
$(".main_image .block").animate({ opacity: 0, marginBottom: -imgDescHeight }, 250 , function() {
$(".main_image .block").html(imgDesc).animate({ opacity: 0.85, marginBottom: "0" }, 250 );
$(".main_image embed").attr({ src: imgTitle});
});
}
$(".image_thumb ul li ul li").removeClass('active');
$(this).addClass('active');
return false;
}) .hover(function(){
$(this).addClass('hover');
}, function() {
$(this).removeClass('hover');
});
Thanks for response. recently i noticed that all of my embedded JavaScript code and external style sheets are being shown IN "view source." this happens in all browsers ( IE, FF, Chrome, and Safari [windows]) ... oddly enough it only happens when viewing on my vista or win2k3 machines. is this something added to these OS's or the result of an installed program? has anyone seen this before? Very new to Javascript (been a HTML/CSS guy for a while, but never really got into more than tinkering with other other people's Javascript coding), but I came across a situation I can't find canned coding for, and trying to create it from bits and pieces I Googled has led me to a dead-end. In summary, I have a website that I frequently visit (FWIW, Firefox 3.x is my browser of choice) with many image sources referring to URLs that end with "-thumbnail.jpg". However, for better image quality, I am trying to use Greasemonkey to replace all instances of "-thumbnail.jpg" in the source of images on this site with "-bigthumbnail.jpg". The closest I could think of was to somehow use getElementsByTagName and innerHTML.replace, but realized that innerHTML does not do HTML, only content. Below is as far as I tried to get on my own, I appreciate any assistance from the folks here to help a JS novice like myself, thanks! Code: (function() {
var as,ae;
as = document.getElementsByTagName("img");
for (var i = 0; i < as.length; i++) {
ae = as[i];
ae.innerHTML = ae.innerHTML.replace(/-thumbnail/gi, "-bigthumbnail");
}
})();
Hi, I currently created a video uploader, but when the video is too big in size, the page seems to be not doing any until the video is completely uploaded. I want to put somewhat like "loading.. please wait" script until the video is not completely uploaded. Thanks. //Ana Hi, can anyone tell me... Code: function Obj() {
this.recursiveMethod=function () {
//...how to invoke Obj.recursiveMethod from here?
}
}
Gus My question is about the following javascript function that converts 15 digit salesforce IDs to 18 digit salesforce IDs. The function was originally posted here. Developer 1 wrote the function: function convertToCaseInsensitiveId(id) { var hash = ''; for (var c = 0; c < 3; c++) { var h = 0; for (var i = 0; i < 5; i++) { var ch = id.charCodeAt(i + c * 5); if (ch >= 65 && ch <= 91) h += Math.pow(2, i); } hash += String.fromCharCode(h > 26 ? h + 48 - 26 : h + 65); } return id + hash; } Developer 2 said: Since the checksum numbers are mapped to AB..YZ012345, 25 gives Z. The following line > hash += String.fromCharCode(h > 26 ? h + 48 - 26 : h + 65); should be > hash += String.fromCharCode(h > 25 ? h + 48 - 26 : h + 65); otherwise 26 would be mapped to opening bracket (ASCII # 91). Which developer's solution is correct? I have a javascript assignment I am having difficulties with. I have most of it complete but need some assistant with the last portion and that is to get my display function to work. I am sure that this is something I should know how to do but for the life of me can't seem to figure out and just need a little guidance. Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Lab03</title>
<h1> Person Information </h1>
<script type= "text/javascript" charset= "utf-8">
function Person( ) {
this.lastname = ' ';
this.firstname= ' ';
this.areacode= ' ';
this.phone_number= ' ';
this.show_person = ' ';
}
</script>
<script type= "text/javascript" charset= "utf-8">
var per1 = new Person
function getInput( ) {
lastname= prompt("please enter your last name: ");
firstname= prompt("please enter your first name: ");
areacode= prompt("please enter your area code: ");
phone_number= prompt ("Please enter your phone number (ex:888-8888): ");
return per1;
}
per1= getInput( );
</script>
</head>
<body>
<script type ="text/javascript" charset= "utf-8">
function show_person( ){
if( firstname == "" && lastname == "" )
{
document.writeln( "Name: Unknown" + "<br/>" );
}
else if( firstname == 'null' && lastname == 'null' )
{
document.writeln( "Name: Unknown" + "<br/>" );
}
else if ( firstname == "" || lastname == "")
{
document.writeln("Name: " + lastname);
document.writeln(firstname + "<br/>");
}
else if ( firstname == 'null' || lastname == 'null')
{
document.writeln("Name: " + lastname);
document.writeln(firstname + "<br/>");
}
else
{
document.writeln("Name: " + lastname + ", ");
document.writeln(firstname + "<br/>");
}
else if ( areacode == "" || phone_number == "" )
{
document.writeln ("Phone: ");
}
else if ( areacode == 'null' || phone_number == 'null' )
{
document.writeln ("Phone: ");
}
else
{
document.writeln('Phone: (' + areacode + ')');
document.writeln(phone_number);
}
return this.show;
}
</script>
<noscript>
<p>You must enable javascript to view all the features of this page.</p>
</noscript>
</body>
</html>
Can someone help me out and tell me what it is I need to do to make it work? I actually had it working when I was able to put all the code in the get function but was told I needed a separate display function so any input is greatly appreciated. I am building a website and I need to gather some information but I feel that prompts are unappealing. Maybe something like a form but it defines whatever is typed in as a variable?
I am trying to create a function that takes a users input in the form xx/xx/xxxx. Then I need to figure out a way to compare to a new date and give which day of the year it is when using: alert("This is the" +foo+ "day of the year."). Im alittle confused on how to take the users input and compare it somehow to give me the day of the year.
Hello all. I have a script to prompt a user for 4 pieces of information. First name. Last name Area code. & Telephone number. My assignment was to do this, and put the information is as follows. If both, first name & last name are entered, store in object as last name,first name. If only one is entered. display without the comma. Also store telephone number in (XXX) XXX-XXXX format. I was told to use methods to do all of these things. Please take note I am in a VERY basic javascript class. Thanks in advance. CODE I HAVE SO FAR : head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <script type="text/javascript"> last=name=area=num=''; function info ( ) { last = prompt("Please enter your last name",''); name = prompt("Please enter your first name",''); area = prompt("Please enter your area code",''); num = prompt("Please enter your phone number",''); }; function Person (info) { this.name = name this.last = last this.area = area this.num = num } </script> <title></title> </head> <body> <script type="text/javascript"> info ( ); teacher = new Person(); tempString=''; document.writeln ( last ); document.writeln ( name) ; if(area==''||num==''){tempString='';} else{tempString = teacher.area +''+ teacher.num} document.writeln ( tempString); </script> Hi all! I'm pretty new to JavaScript and completely new to this forum. I'm James. Well uh, I'm not sure how to... I wanted to make something like this using javascript... Code: myObject.someMethod('something').anotherProperty
much like the Code: document.getElementById('someId').style.morestuff
But the thing is, I've been around every DOM whatnot I can find, I just can't seem to make it work. I kinda need it to make my own DOM for some API i'm writing. So I can write like... Code: function someGreatAPI(){
this.property1='';
this.property2='';
//...
this.method1 = function(var1){ //this should make my firstMethod
this.nestedProperty = 0;
this.nestedMethod = someFunction; //firstMethods nested method
}
}
//so I can use it like...
var obj = new someGreatAPI();
obj.method1(10).nestedMethod();
It has to be possible, it's possible with document.getelementbyid, right? it has to be. Thanks in advance. Hi everybody! I've a problem and I'm not able to solve it alone. I want to invoke java methods of a self written java programm with javascript. I found something like a tutorial (http://stanislavvitvitskiy.blogspot....lications.html), but it has not worked. I put my class file in a jar file and when I want to load it in javascript i get an error. I tried it this way: var url = new java.net.URL('C:/java_js' + '/xultest.jar'); var cl = new java.net.URLClassLoader(url); var aClass = java.lang.Class.forName("com.stan.XULDemo", true, cl); var inst = aClass.newInstance(); // Calling 'sum' function from java var a = inst.sum(2, 3); alert(a); // Will alert '5' Can anyone please help, and say to me what's wrong about it? Or does anyone have another aproach to call java methods with javascript? cheers, Martin Okay so I'm trying to come up with as many alternative methods to accomplish something. So I'm just seeking input from anyone who is willing to supply some. After the user clicks on a match type it'll know HOW MANY sides to the match there are so say for a singles match it'd have 2 sides (1 vs. 1) for a Triple Threat Match it'd have 3 sides (1 vs. 1 vs. 1) and so on. All matches have a stored field in the database of how many sides they have. So I'm thinking that I could have it create 3 divs (or something) down in the competitors area of how many sides there are in the match (separated by a VS. text block) and when the user selects a character from the dropdown and adds a character the user can maybe drag and drop the character's name to whatever side they choose. Its one idea. If you think of an EASIER more EFFICIENT way to do something like this and have an idea say something please or even if you can't let me know that you think it's a worth while idea. Code: <label for="matchtypedrop<?php echo $i+1 ?>">Match Type:</label>
<select class="dropdown" name="matchtypedrop<?php echo $i+1 ?>" id="matchtypedrop<?php echo $i+1 ?>" title="Match Type <?php echo $i+1 ?>">
<option value="0">- Select -</option>
<?php
$query = 'SELECT id, matchtype FROM matchtypes';
$result = mysqli_query ( $dbc, $query ); // Run The Query
while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) {
print "<option value=\"".$row['id']."\">".$row['matchtype']."</option>\r";
}
?>
</select>
<label for="competitors<?php echo $i+1 ?>">Competitors:</label><ul id="competitors<?php echo $i+1 ?>" style="list-style: none; margin-left: 195px;"></ul>
<select class="dropdown" name="charactersdrop<?php echo $i+1 ?>" id="charactersdrop<?php echo $i+1 ?>" title="Characters Dropdown <?php echo $i+1 ?>" style="margin-left: 195px;">
<option value="0">- Select -</option>
<?php
$query = 'SELECT id, `character` FROM characters ORDER BY `character`';
$result = mysqli_query ( $dbc, $query ); // Run The Query
while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) {
print "<option value=\"".$row['id']."\">".$row['character']."</option>\r";
}
?>
</select>
<input type="button" value="Add Character" class="" onclick="Competitors(<?php echo $i+1 ?>)"/>
Do many programmers remember most of the object properties and methods or do they use IDE or references to find those specific objects. I'm starting to learn Javascript and seeing all the different type of objects available can be depressing. I currently have the following code: <script> function strstr (haystack, needle, bool) { var pos1 = 0; haystack += ''; pos1 = haystack.indexOf(needle); if (pos1 == -1) { return false; } else{ if (bool){ return haystack.substr(0, pos1); } else{ amp1 = haystack.indexOf('&'); if((amp1 == -1) || pos1<amp1){ alert("here"); return haystack.slice(pos1); }else{ bString = haystack.slice( pos1 ); pos2 = bString.indexOf( needle ); amp2 = bString.indexOf('&'); //alert(bString.slice( pos2)); return bString.slice( pos2 ); }//if(amp>1){ }//if (bool){ }//if (pos == -1) { }//function strstr var story = strstr(top.location.href, "story="); var pinID = story.replace("story=", ""); alert(pinID); if(pinID>0){ document.getElementById('iFrame').src = 'http://www.domain.net/index.php?story='+pinID; }//if(pinID>0){ </script> It takes the website URL in Javascript and I wanted it to see if there is a "story=1" id and then pass it to the IFRAME. This works in a fashion, but i was trying to make it into a function so I could find and pass other variables, but anything after an & sign and it all fails? I was hoping to pick out variables from the top.location.ahref of "http://www.domain.com/index.php?story=1&category=2&something=3" for example? Any help would be appreciated. Many thanks |
|||||||