- Screen name: Mirco
Mirco's Profile
3 Posts
12 Responses
0
Followers
Show:
- Expanded view
- List view
Private Message
- Hello,I've my portfolio online here http://mircofragomena.comAs you can see every time you hover on a menu item the background changes, but on mouse out the background won't go back to the original one, but keeps the color of the last hovered item.It's the only bug so far and I'd like to fix this as I'm jobless and I've to share my portfolio with clients and companies :DThis is the JS that changes the background color, and should bring it back to its initial one on mouse out:$(function() { // Shorthand for $(document).ready(function() {var body = $('body');var bg = body.css('background');$('ul.nav a').hover(function() {body.css('background', $(this).data('bgColor'));}, function() {$(body).css('background');});});Every item has a different color, which will be the initial background color of the page of the item itself.Not sure what other informations you might need but feel free to ask me.Thanks a lot for this, gonna get some work hopefully ;)
- 11-Dec-2018 04:49 PM
- Forum: Using jQuery Plugins
I'm currently using this
jqFloat.js
that makes elements float in space around the page.
Unfortunately, they float in relation to the size of the screen, and not of their parent container, which is what I wish to achieve.Here's the HTML of my structure
- <div class="wrapper">
- <div id="projects">
- <div>
- <a href="projects/first/index.html" class="project-item">
- <img src="images/body/brain.png" id="image" class="brain" />
- <span class="title">Sintesi addittiva</span>
- </a>
- </div>
- <div>
- <a href="projects/first/index.html" class="project-item">
- <img src="images/body/eyes.png" id="image" class="eyes" />
- <span class="title">Menschen Messe</span>
- </a>
- </div>
- </div>
The class .wrapper is set at height: 100%; width: 85%; via CSS, and .project-item is the class of my floating items.
This is the source of jqFloat.js https://github.com/kennyooi/jqfloat/blob/master/jqfloat.js
At the moment my items are floating correctly, and at random position every time the page loads, but sometimes they get out from the wrapper (and the screen too).
I've tried to assign the
.projects-item
(which is the class that triggers the floating effect) to the parent div, but then the items disappear.What I basically have to achieve, I think, is to define a space within which the code of the jqFloat should run, and if one of the items touches one of the edges of the wrapper the item would have to "bounce".
Maybe I might have to set a rule on the script I'm using to randomly position the items instead of the jqFloat? This is not to exclude, but I'm also not very sure about.
This is the website at the moment, in its very rough design. The items (the body parts) have to stay within the green lines, which is the
.wrapper
.Any help is very very appreciated
- I have a menu where on every hover of its links the background color of my page changes.
Now, let's say that my default index.html color is blue, and when I hover on about and contact I have yellow and red.
If I click on the about page its background color will be yellow, and if I hover on home it will go back blue.
What happens is when I mouseOut back to the page, the background changed to blue again, same if I'd hovered on contact.
I uploaded an early stage of the website so you can take a look at the problem and the behaviour of the bg. http://mircofragomena.com/
As you see on the front page the bg is white, but when you hover changes. If you click on pickabrew, you will see the page in yellow as when hovered, but if you go again on the menu hover/out, the page goes back in white as the front page. It should stay yellow though, as it should happen with every other color/page.
I basically have to create a condition that says if the bg-color is the same of the hovered link, keep it like this, otherwise change it to the original one of when the page was loaded, and have an array where I save all the colors for each loaded page. I'm not really good with conditions though, so maybe you could help me?
Would be great - it's the final step before I can create all the pages of the website!- «Prev
- Next »
Moderate user : Mirco
© 2013 jQuery Foundation
Sponsored by and others.

