110 comments found.
I tried looking into the drop down navigation menu, and I found this, http://www.greywyvern.com/?post=337, but wasn’t able to sort through it all and figure out how to apply it. It seems to address the issues there.
Also, I figured out how to add a delay on the tooltips, but I was hoping that would fix my problem, but it didn’t. When I mouse over the tool tip text sometimes it pops up, then goes away, then pops up again. And sometimes it won’t pop up even though I’m hovering over the text for the tool tip. I checked your live demo and it does the same thing. Here is a screen video of the problem: http://youtu.be/7Aq0UqfyEu0
It looks like this is the problem, http://www.bennadel.com/blog/1805-jQuery-Events-MouseOver-MouseOut-vs-MouseEnter-MouseLeave.htm, but it looks like you are using hover. Any ideas? Thanks
Also, the Tipsy Demo, http://onehackoranother.com/projects/jquery/tipsy/, doesn’t have this problem.
OK , I’ll take a look into them (I’ve added the tooltip issue you mentioned to my “GearBox todo list”) and will reply to your questions.
Best
Lakshan
Thanks!
Any chance of making this a Wordpress theme. Its a superb theme
I’m so glad you like the template. There will be a wp version of GearBox HTML , but not any sooner. Regarding my Themeforest works , I’ve planned to release GearBox v2 (free update) , and another HTML template before the releasing a WP version of this template.
Best
Lakshan
And is there a way to delay the closing of the navigation drop down menu for a specific time. I have several tiers and if the mouse rolls off of it, then it closes and I have to start the navigation all over. Kinda frustrating.
I tried to do it using CSS transition delay property , but for some reason , it affected only with the “revealing” state.
Is there a way to use images in the tool tips?
You can add HTML code inside tooltips , so just try adding <img alt="" src="path/to/ur/img" /> inside data-tooltip attribute.
Best
Lakshan
I have no problems with the normal tool tips, but I’ve tried adding the image html everywhere and I can not get it to work correctly. I’ve tried it in the div in the data-tooltip section and I’ve tried replacing the div and it still doesn’t work.
Also, while I’m asking about the tool tips, is there a way to delay the closing of it? Say leave it open for 1 second after your mouse rolls off of it?
I’m not sure about your implementation , but you can add data-tooltip to almost any element ,and tooltips can hold any html element. Maybe you can not get it to work properly because of a syntax error ? (make sure you use ” and ’ correctly inside attributes)
That was it! I was using ” instead of ’. Is there anyways to delay the closing of the tooltip when you remove your mouse? Maybe a one second delay to leave it open? I’ve seen it mentioned in the instructions documentation of the Tipsy javascript, but I can’t find where to edit it in the template.
Open custom.js and search for “tipsy” , and then you’ll find the related code block where you can add more properties etc.
Also essential.plugins.min.js contains a minified Tipsy script. And finally if you want to see the non-minified version , go to js/all/jquery.tipsy folder.
Best
Lakshan
Hello, I have downloaded the theme. I’m having issues with the viewing in Safari and Internet explorer? It’s unusual for safari not to open properly. It’s fine in firefox, but obviously I will need to fix it for people to view it.
www.reigatepolefitness.co.uk
Thanks Sam
Hi Sam
GearBox HTML template is pretty much mature at this point so I do not think this is related to the template. But anyway can you be more specific on the issue(s) so I can take a look into it.
Best
Lakshan
Hey, is there a way to easily incorporate print friendly css (@media print) in the next update?
I’ll consider your request in a future update. Adding a print friendly stylesheet is not a complex task , here is a great article on print-friendly stylesheets :: from A-List-apart . You can read it in the meantime
Lakshan
Thanks. Since all of the css is on a different page (base.css I think) I don’t know how I would I incorporate it (on each page, or on the base.css), and would I need to do anything with the remaining css to let it know there was a difference (print vs screen)?
Just add your print-specific css in base.css (bottom is prefered) , inside @media print {}. (it’s just another media query).
@lakshan that was it!, problem solved.
Many thanks!
Ok great !.
Please advise!
I can confirm you that the twitter feed on current GearBox version works fine. On your contact page(the above link you provided) , my devtool shows a 404 error on http://eskamedia.nl/js/jquery.min.js(note this URL ) so you should first check if the url/file names are correct.
Hope that helps
Lakshan
Thanks for the Update !! I want to thank you for the quelity of the release and I want to ask you if there is another awesome release like this soon ??
You’re welcome and thanks for your interest . Yes , I’m currently working on another HTML template , and also GearBox v2 is almost complete so stay tuned for updates ! I’m doing my best to release them as soon as possible.
Thanks again
Lakshan
Update available – v1.5.4
If you’re having trouble with the twitter feed , please re-download the template and follow the instructions in changelog.txt to properly update the twitter script.Placed https://github.com/remy/twitterlib/raw/master/twitterlib.min.js in essential.plugins.min.js on my website and is now working
Yes , that’s the best thing to do . I’ve just uploaded the updated version (v1.5.4) to ThemeForest (it will be available for buyers to download soon.).
Best
Lakshan
I have changed my essential.plugins.min.js and made the changes in the base.css as per changelog but the twitterfeed is still failing. Any ideas?
The above only applies to the contact page
Hi Lakshan, I’ve made the upgrades to v1.5.3 but the twitterfeed still says loading… Any ideas?
I’ll update the template with a better fix ( please read the above conversation to get a better idea) ; just allow me some more time to do so. By the way you said the twitter feed isn’t working on contact page but works fine on other pages ?
- L
Im still getting “Loading” :-s Has anyone got this working correctly?
Please re-download the template and follow the instructions in changelog.txt .
Let me know if you’re still having problems, even after updating your site correctly.
Best
Lakshan
I’m having a problem with the twitter feed. I’ve reloaded the original code even, but I can’t get it working again…
www.HousleyPhotography.com
I’m aware of this—sorry for the inconvenience . I’ll release an update as soon as possible. Untill then please follow these instructions to fix it :
1) Open essential.plugins.min.js ,which is located in js/ folder , in a code editor and do a ‘find’ for “twitter js” related js code block , and then replace that with the updated version (download it from here)
Hope this helps
Lakshan
Ok, I did that, but it still isn’t working correctly. It still says “Loading…’
I’ve updated the template with the fix. Please re-download the template and see changelog.txt for updated files/code blocks.
Still not working for me. Followed instructions in Log.
GearBox uses a third-party script for the twitter functionality. It looks like the new version loads another library from github with https which does not get loaded in some cases .
Please try doing this:
Find https://github.com/remy/twitterlib/raw/master/twitterlib.min.js
in essential.plugins.min.js and replace it with
//github.com/remy/twitterlib/raw/master/twitterlib.min.js
Let me know how it goes—I’ll have to modify/rewrite the twitter script or maybe move to another third party twitter script if this fix isn’t working.
No, that didn’t work for me, but I did copy that js file to my website and changed the link that you mentioned to point to it on my website now and it works just fine.
Thanks so much for helping us out with this issue!!!
You did the right thing
.
If I don’t find a lighter script than the current one (current twitter JS script is over 12 KB with that external library) , I’ll have to do the same thing you did.
Hi man, great theme and great support
In a while we realized a Liferay theme using your work for our company site some time ago. All runs like a charm but now, with Chrome v.22, we have an issue.
Liferay incorporates some yahoo tricks to minimize js and css. With Crome v22 we need to deactivate this function in order to display all as we want. You can also activate this minimizer with an url param: if you try to load http://www.threadsolutions.com/home?css_fast_load=1 (1=minimize, 0=none). With minimizer activated it seems that Chrome (or js) does some error evaluating page width… we have got the same feedback that we obtain reducing browser window width…
Any ideas are wellcome…
Regards Nicola
Hi Nicola ,
Thanks for your compliments
.
It’s pretty hard to debug since I don’t know what changes you’ve made to the template. Chrome dev tools don’t show any CSS or JS error on your site. But I think the problem is with your minified CSS —it seems like there are no media queries exist on the compressed version ?
if you find an issue with the template , don’t hesitate to contact me again .
Best
Lakshan.
Hi, great theme. Can this theme be customized to 810px, for Facebook?
Thanks
In your case ,the template should work out-of-the-box (Open GearBox demo and try resizing your browser window to your preferred screen size ). And yes , the template is super easy to customize.
Best
Lakshan
$(".iframeLink").click(function(){
$.fancybox({
'width' : '75%',
'height' : '75%',
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
return false;
});
The iframe pops up but I cannot get the url to load in the iframe. Can you give me a pointer to what Im missing please, I think Im having a ‘blonde’ moment
Yes , you were having a blonde moment—that’s why you posted a 100% Fancybox related question here .. just kidding
.
href : this.href
Hope that helps
Lakshan
I have added a google map but for some reason this will not work correctly in this template. The map controls are being hidden. Could you advise on this please?
Simply remove max-width from img elements inside the element that holds a Google map.
Just add the following CSS rule to base.css. (bottom is prefered)
.no-image-max-width img {max-width:none !important;}
and add .no-image-max-width class to the element that holds your Google map.
[You’ll find this CSS class out-of-the-box in the next update of the template.]
Hope this helps.
Lakshan