JavaScript - Javascript Carousel - Not From Dynamic Drive
Hello,
I have been noticing a really cool trend on the web and it is called the javascript carousel. Not the one from dynamic Drive. Here is an example of what I am talking about; carousel http://food.yahoo.com/;_ylt=AtuShzEA...hz75HDg9VIY.Y5 check on the bottom of the page where it says "try these recipes" I just love the circle indicating how many "pages there are. Do you know where I can find the tutorial or script for this effect? Thanks, Creations_Kash Similar TutorialsHi all, I'm using the scripts from Dynamic Drive http://www.dynamicdrive.com/dynamici...edcollapse.htm to create a sliding collapsing/expanding div. I need to modify it slightly so instead of an image for the toggle, it has text hyperlink - changing from "Show More" to "Show Fewer". Can anyone help? Thanks Hello all! I hope everyone had a great Holiday I'm hoping someone can help me with a Switch Menu code. I borrowed and modded the code offered he http://www.dynamicdrive.com/dynamici...switchmenu.htm The site I'm trying to implement this menu on is: http://hardlyrhetoric.com/ste/projects.html Additional required files for this page a http://hardlyrhetoric.com/ste/tabcontent.js http://hardlyrhetoric.com/ste/tabcontent.css As you can see, the menu on the left will expand and collapse, revealing the sub-links perfectly fine. It will even display the content for each link in the first set of "Datacenters and Emergency Power" links, as it should. The problem is with each section after "Datacenters and Emergency Power" None of the links will display content in the right column the way the first set of links does. I've looked over the code for several hours... am I missing something basic??? I have an html file I've built with embedded Javascript (using ActiveX) that successfully reads a file on my local hard drive when I run the html file through my web browser (IE) locally. However, when I copy the html page up to a webserver and access it through the internet, it doesn't appear to be reading the local file. I'm assuming this can't be done because of security reasons? Am I correct in that? Is there any way using Javascript/ActiveX that you can get a webpage on the internet to access a file on the visitor's local drive? (other than cookies)
Hi All I've been following an example on how to build an interactive carousel, but I am unable to get the javascript to make the carousel loop continously. I've posted all the code below, if anyone can show me the error I would be very grateful. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Interactive Carousel</title> <style type="text/css"> #feature_holder{position:relative; top:150px; overflow:hidden; height:400px; width:100%;} .feature{position:absolute; width:1000px; height:400px; top:0; z-index:1;} .arrow_right{right:20px;} .arrow_left{left:20px;} .arrow{height: 70px; width:70px; z-index:2; top:160px; position:absolute; background:#000;} #feature_1{background: #666666;} #feature_2{background: #225566;} #feature_3{background: #006600;} #feature_4{background: #ff0066;} #feature_5{background: #00ff00;} #feature_6{background: #0380ff;} </style> </head> <body> <div id="feature_holder"> <div class="arrow arrow_left"></div> <div class="arrow arrow_right"></div> <div class="feature" id="feature_1"></div> <div class="feature" id="feature_2"></div> <div class="feature" id="feature_3"></div> <div class="feature" id="feature_4"></div> <div class="feature" id="feature_5"></div> <div class="feature" id="feature_6"></div> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> <script> var BrowserWidth var FeatureCount var CurrentFeature = 1 var NextFeature var NextNextFeature var PrevFeature var PrevPrevFeature $(document).ready (function(){ setFeatureCount() getBrowserWidth() setClicks() setNextPrev() setFeaturePosition() }); setFeatureCount = function(){ FeatureCount = $('#feature_holder').children('.feature').length; } getBrowserWidth = function(){ BrowserWidth = $(window).width(); } setClicks = function(){ $('#feature_holder').children('.arrow_left').click(function(){ SlideInFeature(true); }); $('#feature_holder').children('.arrow_right').click(function(){ SlideInFeature(false); }); } setNextPrev = function(){ PrevFeature = (CurrentFeature-1); PrevPrevFeature = (CurrentFeature-2); NextFeature = (CurrentFeature+1); NextNextFeature = (CurrentFeature+2); if (CurrentFeature == 1){ PrevFeature = FeatureCount;} setFeaturePosition = function(){ $('#feature_holder').children('.feature').css('left', -9999); var CurrentPositioning = (BrowserWidth/2) - 500; $('#feature_'+CurrentFeature).css('left', CurrentPositioning); var NextPositioning = (BrowserWidth/2) + 500; $('#feature_' +NextFeature).css('left', NextPositioning); var PrevPositioning = (BrowserWidth/2) - 1500; $('#feature_'+PrevFeature).css('left', PrevPositioning); }} </script> </body> </html> Thanks Hey there CF members, i have a huge problem with dynamic JavaScript i am using .load function which is the part of my script built by my programmers to load objects dynamically in JS. the code reads PHP Code: $("#content").load("SOME CODE HERE",hideUpdate); The division id is Content as u can see above. the need is to add a html code at the beginning of it like in php we can use dot operator like "SOME CODE IS " . $ code same way what can we use in here in dynamic html to combine a custom HTML regards I am using the Carousel II Horizontal and it clearly says "Each image hyperlinked and opens in same browser." However, once you click on the image it opens a new browser. I am using this in an online store and I do not want my customers to open a new browser when viewing the product, I want them to click on image to go directly to the product to purchase. Any help? Thanks, Candy Hello, I've used the concept from this website to build a form. http://www.enviromark.ca/english/quoteform.html Notice how the second drop down options change depending on what option is selected in the first drop down. Here's the Javascript Code: var Option1_Array = new Array("Choose a version", "1", "2"); var Option2_Array = new Array("Choose a version", "3", "4"); function program(objProgram) { var objVersion = objProgram.form.Version; var selectedArray = window[objProgram.options[objProgram.selectedIndex].value.replace(/\s/g,'') + "_Array"]; objVersion.options.length = 0; for (var i=0; i < selectedArray.length; i++) { objVersion.options[i]=new Option(selectedArray[i], selectedArray[i].replace(/->\s/g, "")); } } Here's the HTML Code: <form> <select name="Program" onChange="program(this)"> <option value="Start">Please choose a program</option> <option value=Null>---------------------------------------></option> <option value="Option1">1</option> <option value="Option2">2</option> </select> <select name="Version" onChange=""> </select> </form> Now, this code works perfectly, and does exactly what I want it to. BUT I'd like to add more fields that accomplish the same thing. For example choose option1 --> version 2 --> type 3 --> thing 5 Now, in order to do this I believe you need to generate a 'value = "a_value"' in the generated html option and select fields. That way, all you need to do is make separate functions for each level and the function can call the 'value' html attribute to handle each <select> depending on its declared value. If this is the best way (it sounds a little sketchy to me) then any help would be great. Or, if you can add on more child selection options within one function. Thanks, -Matthew I have this piece of javascript code, which enables me to get my Picasa photos without link back feature, in my webpage. The issue is with the hardcoded RSS url feed. I want this to be dynamically passed as a variable to the java script. I use a PHP code, where this javascript is coded. In the below code, if I say var samples = <?php $url_code ?>, the javascript does not recognize. Can someone help on this, as I use the same PHP code, with different url feeds, to display different picasa photo albums ? Code: <script type="text/javascript"> function load() { var samples = "https://picasaweb.google.com/data/feed/base/user/......................../........./.........?alt=rss&kind=photo&authkey=.....................&hl=en_US" var options = { numresults: 2, scaleimages: true, maintainAspectRatio : false, displayTime: 1000, transistionTime: 300, //linkTarget : google.feeds.LINK_TARGET_BLANK }; new GFslideShow(samples, "slideshow", options); } google.load("feeds", "1"); google.setOnLoadCallback(load); </script> Hi, I'm trying to create a dynamic form using Javascript. This form essentially needs to collect data through certain fields and populate another. Code: <input name="Field1" type="text" /> <input name="Field2" type="text" /> <input name="Field3" type="text" /> <input name="Field4" type="text" /> <input name="Field5" type="text" /> Field 6 value = answer I'm stuck on how to go about this. I'm assuming I need to create multiple conditions to check each field and then output to a text box? Code: if ((document.thisform.Field1.value == null) && (document.thisform.Field2.value == null)) { I've done a bit of searching around but can't find anything with particular reference to this exact requirement, only brick level functions. If I have left anything out, or if it's all amiss, please let me know. Can anyone direct me to the source of this carousel or something similar? http://www.murdockyoung.com/projects...-house/images/ Thanks in advance! How do you make a vertical carousel that displays either text or images?
Hi everyone, i am stuck at a problem. i am trying to craete a redimmensionable array using javascript, is there a way to do this, i know that this can be done in vbscript using redim and preserve commands. If not then is it possible to variables between javascript and vbscript, or call vbscript function using javascript. a sample code will be much aprreciated thanks for your time! J Hi, I'd like to create a textarea and a division so that whatever embed code you put in the textarea it gets executed on the division in real-time. Your kind help is greatly appreciated! JavaScript newbie hi friends, I am looking for a solution to display the records of a dynamically selected mysql table using ajax,jsp & js combinations. any sites showing some example thnx in advance. Hi, does anyone know how to make a very simple jQuery vertical carousel? without having to use the plugin...
Hello, I was wondering if anyone knew how to alter SmoothGallery to move the thumbnail carousel from a horizontal one along the top to a vertical one along the right side. It's supposedly possible within the core code, and I've seen it done, but it's not in the documentation and no one on the SmoothGallery forums seems to know how to do it. Ultimately, I'd like to move the carousel to the right side, make it static so that it's always overlaying the main image (rather than clicking to unhide it), and make sure the slideInfoZone is adjusted so as to not overlap with the carousel. I'm assuming that anyone who knows how to do it has SmoothGallery and has made the carousel vertical before... but if not, and someone wants to take a crack at it anyway, the SmoothGallery files are HERE. Thanks for your help in advance! hi, on my website: http://zend.warrencreative.com/gemini-group/index.html the carousel on the right is not showing unless you hover your mouse over?! Can some one please help? I am using : http://www.twospy.com/galleriffic/ not sure what section to post this in, basically i have html in a javascript function that i want to pass into a php. here is some of my javascript code Code: var names = document.getElementById('names').value; var nms = names.split(";;") for (i=0; i<las.length; i++) { var contentString = [ '<div id="tab-1">', '<p><h1>'+nms[i]+'</h1></p>', '</div>' +'<form action="index.php" method="post" enctype="multipart/form-data">'+ '<input id="delbutton" name="delbutton" type="submit" value="Delete">',+'</form>' } then when the button gets pressed it goes to Code: if(isset($_POST['delbutton'])=='Delete') { echo("into the php delete: " . $_POST['name2'] . "<br />\n"); echo '<pre>' . print_r($_POST,true) . '</pre>'; } basically i want to be able to access the value of nms[i] in the php call. i am able to pass anything in <input> tags like normal html, but i want to get nms[i] to go through what should i do? I have a signup form on a site that does a check on submission of fields to see if they populated and error box if not changes focus to missing field and highlights field name in red. I wanted to improve on its effectiveness as it only checks 2 fields atm and I wanted it to check some dynamic fields as well the fields are associative arrays generated via php as follows:- Code: echo "<select name='nfield[$t]'>\n"; for ($i = 0; $i<count($value2); $i++) { echo "<option value=\"".trim($value2[$i])."\">".trim($value2[$i])."</option>\n"; } echo "</select>"; the javascript is as follows:- Code: function checkForm() { //This is the name of the function if (Form1.password.value == "") { alert("Please enter a Password."); Form1.password.focus( ); document.getElementById('password').style.color="red"; return false; } The field is displayed via php as follows:- echo "<tr><td align='center' id='password'>Password:</td><td><input type='password' name='password' size='10'></td></tr>\n"; So i thought ah easy, i will just add the following checking javascript to check each of the associative arrays as they never change Code: if (Form1.nfield[1].value == "") { alert("Please choose an option for option1"); Form1.nfield["1"].focus( ); //This focuses the cursor on the problem field document.getElementById('nfield[1]').style.color="red"; return false; //This prevents the form from being submitted } if (Form1.nfield[2].value == "") { alert("Please choose an option for option2"); Form1.nfield[2].focus( ); //This focuses the cursor on the problem field document.getElementById('nfield[2]').style.color="red"; return false; //This prevents the form from being submitted } if (Form1.nfield[3].value == "") { alert("Please choose an option for option3"); Form1.nfield[3].focus( ); //This focuses the cursor on the problem field document.getElementById('nfield[3]').style.color="red"; return false; //This prevents the form from being submitted } but this doesn't work, i think it doesn't recognise the nfield[1] syntax, can a javascript guru point me in the right direction ? I also wanted to enhance the form somewhat as atm it only displays one error popup at a time, so if the user has missed out a few fields they will get an initial popup, try and submit again and then get the second popup for the other missing field. Can my code be modified to show a list of the missing fields and highlight all the titles in red (and if possible change the background colour of the input boxes or border the input fields in red etc)? |