Links Extend Past Text And Toggle Description Without Photo?
Jan 27, 2011
I have a bit of javascript that is supposed to change picture and its accompanying text when you hover over a bit of link text in another area of the page. This is working, however, the text is toggling without the picture due to an invisible area next to each link. I am not sure if it's an issue with applying my javascript to another bit of code or what.
Here is the code that I have that flips the text:
<script type="text/javascript">
function tabOver(which)
[code]....
View 1 Replies
ADVERTISEMENT
May 3, 2010
I'm fairly new to jQuery and JavaScript. I've beat around the block a couple times modifying code from here and there, but never written anything myself. Just thought I'd warn you.I'm writing a tidbit of code that is going to be used for a photographer's website. The concept of the site is very simple; I am going to have Drupal generating two lists. The first list is simply photographs, semantically they just come one after another. The second is a list of div tags that contain a description of the photographs.The only way that the imagescorrelatecurrently is their semantic order. The first image should be matched with the first description, the second image with the second description, and so on. I do plan on changing this, but for the time being it is not my main concern.
Because the number of images added to the page might not necessarily be limited, I need to have jQuery pair up the images with the proper description, and then display it on hover—dynamically. My current method requires me to write out each hover functionindividually.This is a problem because, as I have mentioned, the amount of photos on any given page should not be limited.Currently I have the functionality that I want, with the exception of the dynamic creation of functions. You can view what I have managed to do so far athttp://calvintennant.ca/blakeley.me/mock.htm.I have attached a .zip with all the files used to create that mock-up.
View 4 Replies
View Related
Jul 16, 2010
am just about at wits end, and I am hoping someone here will be able to assist. I've searched and searched and have come close but to no avail. I found a nice image gallery code from "David's Kitchen" http://monc.se/kitchen/80/lightweight-image-gallery-with-thumbnails and have tweaked it to eactly what I wanted, however, I want to add an image caption of the alternate image text below the active picture. I've tried everything I could think of (with my limited knowledge) with no successHere is the code I have:
<html>
<head>
<style media="screen,projection" type="text/css">
[code]....
View 4 Replies
View Related
Jun 23, 2011
How to do this but still can't figure it out. I'm currently reading jQuery from novice to ninja but I'm no where close to a ninja. I have a div containing list items, a photo, and a plus/minus button at the bottom of the div. The list items are absolutely positioned behind the photo. When I click on the plus button I want it to change to minus and animate the photo 29px from the top revealing the list-items behind it. Then I want to click the minus button changing it back to plus and animating the photo back up to the top.
I'm trying to accomplish something very similar to what you see on Kyanmedia.com. Except their images animate down and up on hover. I want my image to animate down then up on click and toggle the plus/minus image. I'm new to jQuery so I'm having a real hard time trying to figure this out. Everything I've tried doesn't work. The links to Kyan Media to get an idea of what I'm trying to do.
View 1 Replies
View Related
Oct 5, 2011
I've got this little chunk of code running on my freelance portfolio site - on each page (different sections of my portfolio) I have 6 thumbnails and a full sized graphic with some descriptive info, you click the thumbnail and it switches the graphic and other info, that all works fine.But on one page I have some web stuff and I'd like to make the var 'clientinfo' into a link to go to the client's website. I know I need to add an array with the website links, but then I'm not sure how to implement it into the html, I've tried various things I've found on here but I'm not getting anywhere on my own. I know it's something pretty simple (for someone who knows what they're doing) but I just can't seem to grasp it.
the js is like this:
$(function() {
$(".image").click(function() {
[code]....
View 3 Replies
View Related
Jan 13, 2011
I'm trying to add a very simple gallery where the photo is at the top and thumbnails are underneath. All I want to happen is that the photo changes when you click on one of the thumbnails. I've been trying to search for this but the galleries all seem to have stuff I don't want.I tried the following and it does change the image but it also opens up the thumbnail.
Code:
<img id="im" src="photos/039.jpg">
<a href="photos/t001.jpg" onclick="document.getElementById('im').src='photos/001.jpg'"><img src="photos/t001.jpg"></a>
View 7 Replies
View Related
May 20, 2002
I have a large image of all my products. I image mapped the images to their locations. I would like to have something where, if they put their mouse of the proper coordinate it changes the text beside the image (description text).
I don't require a sample, just the sraight code that ACUALLY works.
I used one off dhtmlcentral.com and it keeps on screwing up because of the stupid div features that come with it. I just need something SIMPLE.
View 4 Replies
View Related
Jul 8, 2009
I have a treeview with links in that navigate to other pages when clicked. I didn't want these to cause toggling when they were clicked. My lists are prerendered. I didn't find a very good way to do this, but the following works, This function goes in the head, it is to stop the event bubbling up to the default treeviewcode. function lihyperlinkclick(e)
[Code]...
View 1 Replies
View Related
Feb 25, 2011
I basically have many anchor links where when I click each of them it slidesdown its own div with some text in it. So have I wanted is when I click on one link it will show me the current one and hide the others. This is what I have tried which works great but when I click on a link it opens the div, then click on another one opens the div with one click and when I go back to re-click the previous link I have to double click it in order to work..
This is my js code:
$(".anchorlink").toggle(
function() {
var cont_val = $(this).attr("id");
$("div#unique_anchor_text", this).show();
$("div#unique_anchor_text").hide();
$('.unique_anchor_text'+cont_val).slideDown("fast");
},
function() {
var cont_val = $(this).attr("id");
$('.unique_anchor_text'+cont_val).hide();
});
HTML looks like:
<a class='anchorlink' id='$item'>Comment</a>
<div id='unique_anchor_text' class='unique_anchor_text$item'>some text</div>
View 3 Replies
View Related
Apr 10, 2010
I'm looking for a toggle script that is much like this one. [URL]. Only I am in need of 5 links and have so only one div or element is open at a time. So by clicking one the other closes.
View 2 Replies
View Related
Nov 28, 2010
I have an image wrapped inside a link tag.<a href="somepage.html"><img id="content" src="img/some.gif" /></a>
I want this .click target to be the link: $('a').click(function(e){
Instead, the target returned is the image [HTMLImageElement].
I have tried using closest()and currentTarget:
But they all still return the image, not the link.
View 2 Replies
View Related
Jul 29, 2011
I tried posting the code but it's too long Page address: [URl]... Click first or second photo, pops up fine, bottom text is behind the photo. You can view the JS by viewing source etc, sorry I can't fit it here.
I spent 2-3 hours trying to figure out the problem but I'm new to JS and it looks like pretty convoluted code I'm using (obviously didn't write it myself, it's by "PopBox.")
View 7 Replies
View Related
Apr 28, 2010
I would like to have a code on my page that causes two or more photos to change between each other. For example, photo 1 is shown for a little while, then it switches to photo 2, etc. I would also like to switch text that goes along with the photos. I would like my layout to look like this:Photo / Text about Photoand have both switch after a little while, to the next photo and text.
View 5 Replies
View Related
Nov 17, 2009
I am new to javascript, and am having an issue, which I'm sure is elementary.. I found a script for expandable content, it suffices fine. As it stands, the script toggles images onclick. For example, whence the menu is collapsed, it displays "plus.gif" next to it, and when the menu is expanded, it displays "minus.gif" next to it.
Basically, what I would like to know is, thus: how would I change it to display text icons next to it? For example, in place of "plus.gif" I should like it to display "+" as actual text. I've dredged a number of places, however, I've found nothing. Furthermore, I cannot figure out how to do it.
View 1 Replies
View Related
May 5, 2009
I'm trying to get an A tag to toggle between hide and show when It is clicked, you can check the latest version of my trying here:psdesignzone dot com / jquery / d6tftoggle.htmlI'm trying to change the innerHTML I guess of the A tag to hide or show each time that specific element is clicked (i'll need this to work with other a tags as well)
View 1 Replies
View Related
Oct 20, 2006
I am using prototype to add a "blind" up and down functionality when I click on a table element.
Now, i would like to toggle the [-] in the "altlink" span to match the state. Ie, if a person clicks on the table, the "formhide1" span will collapse, and the [-] should turn into a [+]. Visa versa, when the now collapsed "formhid1" span is expanded the [+] should turn into a [-] Code:
View 8 Replies
View Related
Sep 27, 2011
This code is not able to toggle independently. What can I do so when I click on one of the "1 Comment" links it opens up independently? It also displays like "1 Comment1Comment" instead of "1 Comment" which I assume will display only once if the other issue can be fixed.
HTML:
<span id="c-100" class="numberCom">1 Comment</span>
<div id="c-100" class="comments">
<p>Comment #1</p>
</div>
[Code]....
View 2 Replies
View Related
Nov 4, 2010
im using this to hide and show some text, how do i do to change the text "Show" to hide when i click it and back to "Show" when click it again.
<script type="text/javascript">
$(document).ready(function(){
$('.accordion-content').hide();
//toggle the componenet with class accordion
$('.accordion-toggle').click(function(){
[Code]...
View 2 Replies
View Related
Nov 8, 2010
Working with a script I had found/pieced together online. It toggles the display of certain content along with selected text (i.e., "view/hide"). It's working great in all browsers except for IE7 (go figure). The showing and hiding of the content works, just not the switching out of the values for "show/hide".
The code is below:
View 6 Replies
View Related
Jun 5, 2011
I have a textual "link" that, when clicked, I want the text to change, and I want a number of checkboxes to be toggled on or off. Here's my code. Currently, I just have the text changing - I don't know how to simultaneously check/uncheck checkboxes.
<head>
<script language="JavaScript" type="text/JavaScript">
<!-- toggle off and on, currently unused -->
function checkAll(checkname, exby)
[code]....
View 10 Replies
View Related
Jan 4, 2006
currently I have a page with six links. Now since I want to display the imformation on those six links (when each is clicked) in a #mainDiv (below all the links). if figured the most efficient way of doing so was to have all six "links" in six different div's -- all with display: none... and when a user clicks a link I just have the appropriate div set to display: block. Code:
View 38 Replies
View Related
Jun 15, 2010
Trying to have plain text that you can click (div of newslink) which toggles the right parameter of other element (div of rightSidebar). Set rightSidebar initially with css: #rightSidebar {right:200%}
Here's what I have for script, but still not working:
<script type="text/javascript">
$j(document).ready(function(){
$j('#newslink').toggle(
function()
[Code]....
View 2 Replies
View Related
Apr 20, 2010
I am trying to create a Link that changes its currently displayed text and also toggles the css.display property from inline to hidden. I'm sure there are solution outs there btu I have not been able to find one that does both functions with one click properly and is also easy to implement for people not as familiar with html and javascript. Obviously I am trying to create a show more, show less type link. currently this often shared code works fine to change the current state of the target ID's css.display from none to inline. My end goal is to be able to not only toggle the display of the LONG1 div but to also change the innerhtml of 'short1' from "Show More" to "Show Less".I am still learning about JS so Im really rough around the edges. I tried some different techniques btu I dont ahev them posted on my work pc.
View 14 Replies
View Related
Sep 24, 2005
I switched to using this function to create element:
----------------------------------------------------
function elem(name, attrs, style, text) {
var e = document.createElement(name);
if (attrs) {
for (key in attrs) {
if (key == 'class') {
e.className = attrs[key];
} else if (key == 'id') {
e.id = attrs[key];
} else {
e.setAttribute(key, attrs[key]);
}
}
}
if (style) {
for (key in style) {
e.style[key] = style[key];
}
}
if (text) {
e.appendChild(document.createTextNode(text));
}
return e;
}
---------------------------------------------------------
so instead of the "old" way:
var oMyDiv = document.createElement("DIV");
oMyDiv.setAttribute("id","testid");
oMyDiv.className = "testclass";
I use that function :
var oMyDiv = elem('DIV', {'id':'testid', 'class':'testclass'});
The rendered source shows this:
<div extend=" function (object) {return Object.extend.apply(this, [this,
object]); } "
class="testclass" id="testid">
Question: I don't understand the "EXTEND" part......anyways does it look
legit/right?
View 2 Replies
View Related
Jun 17, 2009
Im looking to have a list of text/links, where once clicked are entered into a text box on the same page... and when a second is clicked - it is appended onto the text that is already in the text box - and so on...
View 4 Replies
View Related
Sep 4, 2007
I would like to extend any HTMLObject with additional functions, such as the following:
HTMLCollection.prototype.getElementByID = function(s_name)
{
alert(s_name);
return null;
}
Unfortunately this doesn't work. However, this one does:
Code:
Array.prototype.getElementsByName = function(s_name)
{
alert(s_name);
return null;
}
Is there a way to do what I'm looking for, perhaps using other techniques?
View 7 Replies
View Related
