CyberShot
-
Posts
322 -
Joined
-
Last visited
Everything posted by CyberShot
-
I am trying to make some animation. I have a <ul> list that I have lined up and given background images to. There are four images. on the right side of each image is some text. the idea is that when you hover over the image, the list element will slide to the left revealing the text that is hidden. then when you mouseout, the image will slide back into place hiding the text. I can not get this to work. Can you check my code? http://www.iwdstudios.com/test any feedback would be greatly appreciated
-
I don't know. I am testing online again and it is working with no changes. I am wondering if it is buggy
-
well, I used I.E tester to check that and it does not work. it just keeps repeating the same one over and over
-
I don't think it is a problem with the jquery. The code works as intended in firefox opera google chrome saffari The only browser I can't get it to work in is I.E 8. It just blinks. the message never changes. Just blinks every few seconds. That shows that the jquery is doing what it is suppose to. I was hoping someone might now what the issue is. If you think it's the jquery, offer up a sollution.
-
I am not sure what category to put this in, so I am putting it here. I am trying to make a random quotes generator. It works. But not in I.E. Here is the test site http://www.iwdstudios.com/random/ can anyone offer a suggestion. <?php class quotes { function quotes() { switch(intval(rand(1,5))) { case 1: $this->quote = "A computer once beat me at chess, but it was no match for me at kick boxing -Emo Philips" ; break; case 2: $this->quote = "It was when I found out I could make mistakes that I knew I was on to something -Ornette Coleman" ; break; case 3: $this->quote = "You can't build a reputation on what you're going to do -Henry Ford"; break; case 4: $this->quote = "People are just as happy as they make up their minds to be -Abraham Linkcoln"; break; case 5: $this->quote = "Good advice is something a man gives when he is too old to set a bad example -Francois de La Rochefoucauld "; break; } } } $quotes = new quotes(); echo $quotes->quote; ?>
-
I had a lightbox effect and a tooltip plugin that both used rel="" to activate them. I found another way to get it done.
-
I need to use two rel tags in my code but it doesn't work. Like this <a href="images/preview.png" title="Valid xhtml/css" class="screenshot" rel="shadowbox[work]" rel="images/preview.png"><img src="images/thumb.png" alt="My Work" height="65" width="65" /></a> I tried rel="shadowbox[work] images/preview.png" but it doesn't want to work, one will be the other won't any ideas for a sollution?
-
yes, that did work. that's a little better than having the hash sign at the end. From what I can tell, there is no really easy way to replace the hash with a word, all you can do is get rid of it. I used return (false);
-
I made a slider that works off the nav. So when you click the about page, in teh address bar, it says mydomain.com/# instead of myaddress.com/about. is there a way to fix this using javascript or jquery preferably?
-
ok, fixed that and also noticed that the funciton wasn't closed with the }); but still something is wrong $(docuemtn).ready(function(){ var contentDiv = array ['about', 'work', 'social', 'contact']; $.each(contentDiv .function(){ $('#'+this+':eq(0)').hide(); $('#'+this+':eq(1)').slideDown(); }); });
-
I am getting a syntax error, this is my test 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>Untitled Document</title> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript"> $(docuemtn).ready(function(){ var contentDiv = array ['about', 'work', 'social', 'contact']; $.each(contentDiv. function(){ $('#'+this+':eq(0)).hide(); $('#'+this+':eq(1)).slideDown(); }); </script> <style type="text/css"> #about { width: 100px; height: 100px; } #work { width: 100px; height: 100px; } #social { width: 100px; height: 100px; } #contact { width: 100px; height: 100px; } </style> </head> <body> <div id="about"> about </div> <div id="work"> work </div> <div id="social"> social </div> <div id="contact"> contact </div> </body> </html>
-
i know of that slider, I have even used it. I was wanting to make my own to learn. I am going to try out your code right now and see if I can get it working on a test
-
i didn't know you could do that. it does the same thing as the iff? I have been looking through the jquery, but sometimes the code examples they give are to confusing. so I tend to do things the long way around. I don't know javacript, learning it as I go along
-
what about the if statement in the code? would it be if('#'+this+':eq(1)){ $(this).slidedown } else { rest of code here }
-
i need help with my code. I made a very very simple slider that does work. Here is the code $("#headerBottom p").hide(); $("#logo").hide(); $("#headerBottom p:eq(4)").show(); $("#content span").hide(); $("#content span:eq(0)").show(); $("#topLogo").click(function(){ $("#content span").hide(); $("#headerBottom p").hide(); $("#content span:eq(0)").show(); $("#headerBottom p:eq(4)").show(); }); $("#aboutPage").click(function(){ if($("#content span:eq(1)").is(':visible')) { $("#aboutPage").show(); } else { $("#headerBottom p:eq(4)").hide(); $("#content span").slideUp(); $("#content span:eq(1)").slideDown(); $("#headerBottom p").hide(); $("#headerBottom p:eq(0)").show(); } }); $("#workPage").click(function(){ if($("#content span:eq(2)").is(':visible')) { $("#workPage").show(); } else { $("#content span").slideUp(); $("#content span:eq(2)").slideDown(); $("#headerBottom p").hide(); $("#headerBottom p:eq(1)").show(); } }); $("#socialPage").click(function(){ if($("#content span:eq(3)").is(':visible')) { $("#aboutPage").show(); } else { $("#content span").slideUp(); $("#content span:eq(3)").slideDown(); $("#headerBottom p").hide(); $("#headerBottom p:eq(2)").show(); } }); $("#contactPage").click(function(){ if($("#content span:eq(4)").is(':visible')) { $("#contactPage").show(); } else { $("#content span").slideUp(); $("#content span:eq(4)").slideDown(); $("#headerBottom p").hide(); $("#headerBottom p:eq(3)").show(); } }); }); my issue is that I am using the span tag as a hook. To say in the code...Find all span tags and hide their content. But the problem is that the span tag is an inline element and I am running into validation problems using a block element inside an inline element. So I need to re work this code. I thought instead. Maybe I could put my 4 divs into an array and call them that way or seperately. something like var contentDiv = array [#about, #work, #social, #contact]; so then in my jquery above, instead of saying ("#content span").slideUp(); I could do ("contentDiv").slideUp(); ("contentDiv:eq(1)").slideDown(); but not sure how to make the array. can you help
-
figured it out. changed to this $("#aboutPage").click(function(){ if($("#content span:eq(1)").is(':visible')) { $("#aboutPage").show(); } else { $("#headerBottom p:eq(4)").hide(); $("#content span").slideUp(); $("#content span:eq(1)").slideDown(); $("#headerBottom p").hide(); $("#headerBottom p:eq(0)").show(); } });
-
well, I got it partially figured out I think. My content is simple. about page, work page, social page, and contact page. each page is in a div div id="about" div id="work" div id="social div id="contact" I wrapped every div in a span so that I would not need the exact id of the div in order to hide it. I could just do $(span).hide() and every div would be gone. So now I did this $("#aboutPage").click(function(){ if($("#content span:eq(1)").is(':visible')) { $("#aboutPage").unbind("click"); } else { $("#headerBottom p:eq(4)").hide(); $("#content span").slideUp(); $("#content span:eq(1)").slideDown(); $("#headerBottom p").hide(); $("#headerBottom p:eq(0)").show(); } }); when I click the about nav link that hs the id aboutPage, the page does not slide again, however, I can not go back to it once I leave it. everything works fine until i go back to the about page and click the about link a second time. I can go to any other page, just not the about page again. http://www.creativeeventsdesign.com/vCard try it out
-
I built a slider with four links. when you click the next link, the next page slides up from the bottom. and the previous page gets hidden. All is good. Here is a code sample. All the pages are the same $("#aboutPage").click(function(){ $("#headerBottom p:eq(4)").hide(); $("#content span").slideUp(); $("#content span:eq(1)").slideDown(); $("#headerBottom p").hide(); $("#headerBottom p:eq(0)").show(); }); when you click the anchor link with the id of aboutPage, I first hide some text inside a P tag with the index of 4, then make any content inside the span tag slideUp to hide all previous content, then slideDown the content I want. In this example, it's the about content. Then I hide a message in the header and show a different one. what I need is a conditional statement that says if I am already showing this content, then to unbind the click event so that they page doesn't slide every time you press the about link when you are on the about page. Here is what I have been trying if($("#content span:eq(1)").is(':visible')) { $("#aboutPage").unbind("click"); }
-
it looks like it worked. Thanks, that saved me about 8 hours worth of work. I kow it would have taken me all day to figure that out. Now, can you exlplain why changing it to relative over absolute did the trick?
-
that isn't working for me. I will keep playing with what you posted. Thanks.
-
i don't understand what you mean. The code is in a container, the jquery hides that container and then shows it.
-
yea, that made it show, but the same problem, the content shows before the slide is finished http://creativeeventsdesign.com/vCard/ click the about link
-
I made content. I wrote jquery code to slide my container down to show the content in the container. but the words show in the container before it gets done sliding. How do I fix this. I am trying display none in the css right now and the setting it to visible in the jquery like this $("#aboutContainer").css("display","visible"); but it's not working
-
thanks, i will try that out. i only understand about half of it. so this should be fun
-
i am trying to build a photogallery. So the thumbnails will have 4 pages on the right all four will be hidden. then a main image on the left. Below the main images will be four dots. The first dot will be blue to indicate the first page is active, the rest will be gray. When you click on the second dot, it will turn blue and the first dot will turn gray to indicate the second page is active and all others are inactive. I played with the jquery function prevAll, but it only worked going one way, it would work on the next one, but not the previous on. going up would work fine, going back would turn all dots blue
