I need to build a page that allows users to ordinally rank elements (first, second, third etc.) and then add a numeric value to indicate the difference between each rank (3.2 or 27.8, whatever). I have a base ordinal ranking that I would like them to start from but I need the user to be able to move individual elements up or down to indicate the ordinal ranking.
Does anybody have a working example of something like this that I can look at? I can do the coding, but I am more interested in looking at the interface to get some ideas on a 'clean' way to go about it.
i have looked around all over the place for some code that will do this, but everything seems to fall short. i'm relatively new to js, but this seems like it would be one of the more simple things to do.
basically, i'm after an effect similiar to the "sign in" box at the top of twitter's pages - not the pop-up form, just the swapping images and background colors, etc. i have a couple of simple scripts that work, but only with simple text and not blocks of code - i.e. a div with a class containing some text and a small image.
all of the examples i have found involve swapping the div from a source somewhere else on the page, such as a menu or something similar, which is obviously not the same thing.
Want to swap multiple divs using onclick. Understanding of js is cursory. The way its set up now is when you click it hides a pre-specified div-this causes issues because you dont know which div the user is going to be on and if the user is on a different div then one specified it hides random divs. I want to hide the 'active' div. Heres the code. In head:
Code: <script type="text/javascript" language="JavaScript"><!-- function HideDIV(d) { document.getElementById(d).style.display = "none"; } function DisplayDIV(d) { document.getElementById(d).style.display = "block"; } //--></script>
One first load, the category list is going to be a short list of the top 5 major categories. Each major category will have a sublist of 3 subcategories below it. Lastly, there will be a link labeled 'more' that when clicked, will toggle out divs and display a full category list. Lastly, all other primary categories will have their short list hidden as well, so you only see
the Primary Category followed by a 'more' link. Here's a crude example of what I mean. First block is 'first load'. Then the next block would be how it'd look if I clicked the "more" link below vehicles
Can JQuery toggle be use to switch divs on page load instead of having to click a button to start the action? What would I have to write in the header to make this happen if this is possible?
I have come across a very interesting problem that seems to be impossible to solve. Basically a web application that I am working on relies on a JavaScript function called go to change the input named view to the page name and submit the form. This form's type is post, so no values are included in the actual URL string. There is also another input called action and it's value is view. This is to tell the application that the user would like to view a page. The problem is because of the variables being of method post, page refreshes and back and forwards return errors because the post variables view and action aren't sent with the required data. To somewhat solve this problem I have created a feature that tells the application that if the post value page is empty then to try and get a GET var called page. To insert this var into the go javascript function I simple add this code
This line basically adds &page=[page] to the action of the form. The problem is, this code doesn't work because action is also the name of a form element. Referencing document.go.action refers to the input element named action and not to the form's action. Changing the named of the action input value is out of the question (Way to much changing of code, and possible room for error). What can I do to change the action of the form without referencing the input named action. Here is my go form and the JavaScript code:
I am using javascript to switch between a series of divs, on clicking a navigation tab the divs display property is set to 'block' and all other divs have their display property set to 'none'. That works fine, the problem I have is when I redirect to another page (e.g. a PHP script) on return to the index the divs have reset and only the default div is shown, rather than the div that was showing when the user left the page. The solution, as I see it, is two stages: Write a function to display the relevant div based on the variable passed to it, then work out how to pass this variable around various pages (post/get). I am very inexperienced with javascript and it drives me mad that the script literally does nothing rather than throwing up an error (as in PHP) but this is what I have so far in terms of a function:
I have been trying to do some tooltips for a website and desperately wanted to learn something new and do that with jQuery.However, every time a mouse hovers over a tooltip, all hidden divs are shown, not just the one that supposed to. Here's my html:
I'm looking for some javascript to work with wordpress (jQuery preferrably) that will show/hide multiple divs on one click.
I had one working but it was kinda janky because it was causing me to have two divs with the same ID on one page. No good.
Since I updated to wp2.8.3 prior to launch, it's not working. So I've decided to just try and do it right.
Here's a page: [URL]
So, what I want to happen: On page load, the first tab: "general" and it's corresponding div beneath should be showing. And the first image should be showing. The other content divs and images should be hidden. I've given the text content divs a dashed border to show their borders. When a visitor clicks "dine at home" the general div and image hide, the second content div shows, as does the second image (it's currently the identical image, but the client may change later.) Etc.
I'll be using this function on a few other pages as well.
how to adjust this javascript to work on two different IDs at once?
I am looking for JS script to replace find all the href values on a page and replace those href values matching them with an array of values.my array, lets say is a = {'some.ex.com', 'abc.ex.com/tv', 'some. name. ex.com', 'bcd.ex.com/dir1/dir2/some.jsp' }; etc.i want to find all the URLs on a given page, check if each found url matches with any of the values in the array, if match found, just replace only "ex.com" with "example.com" for every match.
I'm hoping that there is a simple script that can rotate images and text links on a page, always showing perhaps 5 or 10 images although in a different order every time. This would be used to equalize ads on a few of my sites, an example can be seen here Code:
okay, now i know this is probably really easy, but i have about a 2% knowledge of javascript (i know i should learn it)
anyway what im after is something that will do the following
i have 1 image that is 160x106 pixels, on the other side of the page i have 5 thumbnails (16x10pixels) now when somebody clicks on one of the 5 thumbnails i want the full size version of that picture to apear where the 160x106 picture is...
How in javascript can I swap the cells in a table? I know I can copy the innerHTML and style and other bits manually but can I just swap 2 cells in different rows?
I know this is sorta reposting but I want to simplify the issue a bit. Take the following script:
function replacemain(s){ var x = document.images['MainImage']; var y = document.images[s]; var pictemp = x.src; x.src = y.src; y.src = pictemp; }
All I want to do is replace the image specified as "s" with the MainImage. Actually swap them so that each execution of the function will swapp and reswap the images without loosing anything. This generally works, however, on a couple IE6 browsers it causes blank images to swap in....
I was wondering if there is a method to swap the contents of a div with jquery? The event is triggered when internal elements are clicked. Say and image and a link within the div, and also to be able to jump back to the same div with the same events.
I'm trying to create a jquery nav that will show up in place of the existing paragraph or div with a ul, then on the mouse out replace the existing paragraph. I'm not not too experienced with javascript, so I'm hoping it's just a simple and easy fix.This is what I have so far. I managed to get it to work, somewhat, but the paragraph shows up if you mouse off the main button over the ul. And for some reason it doesn't always show the menu on the mouse over, is picky about which ones it does.
I'm trying to set up a series of questions, which would look basically like an unordered list. Then, upon clicking a box next to any of the questions, the answer would appear underneath the question. Clicking that same box a second time would cause the answer to disappear. It seems very simple, and I've tried using a couple of different text swapping functions, but for some reason I can't get the answer text to appear in the right places. The script seems to have a hard time keeping track of where things are supposed to go, and it's really irritating me. I need to find a solution ASAP.
I´m completely new at javascript, and I got a little issue. I want to be able to have some text in my index-page and 2 buttons to change this text back and forth with diffrent text. Say i have one headline like this
<div id="first"> <h1>Hello world</h1> <p>Lorem ipsum etc............</p> </div>
and i want 2 buttons under this text beeing able to swap all this code for say this:
<div id="second"> <h1>Hello president</h1> <p>Lorem ipsum etc............</p> </div>
and most likely sevral more swaps, so the buttons would work like a library function.
Can anyone point me to an image rollover script that uses id and not name in the img tag?
I'm trying to validate a page (using validator.w3.org) that uses the name attribute in support of some javascript image rollover script, but this is causing the validator to error.
I've got a JavaScript / CSS question if anyone has a spare minute and the interest? I've got a page with a background image set by CSS. I want to use a Javascript function to change that image with a link click. Here's a snippet from my HTML:
HTML Code: <body> <script type="text/javascript" src="changeBGimage.js"></script> <style type="text/css"> body {background: url('red.jpg') no-repeat} </style>
[Code]...
Would you be able to tell me how I would structure that function?
I have a simple navigation bar using an ul with images.
I have the following script that swaps out the images on mouseover and mouseout to create "hover" effect.
The issue is when I try to set the src attribute of the image that has been clicked the image does not change. The first part of the click event is working and resets the src of all the images as expected, but the second part that sets the src for the image clicked does not either run or runs before the reset.
