akerman
|
|
« on: September 25, 2008, 05:22:09 AM » |
|
Hi,
No big thing, just annoying enough for the user/visitor:
Clicking the magnifying glass in order to perform a site search, requires the mouse pointer to stay on the search field when typing in the search request. Otherwise the field will vanish.
It would be preferable to click, and fill out the field, not concerning of where the pointer is standing.
Regards Akerman
|
|
« Last Edit: September 30, 2008, 12:51:04 PM by akerman »
|
Logged
|
|
|
|
paulmin
Jr. Member
Offline
Posts: 70
|
|
« Reply #1 on: September 25, 2008, 06:47:04 AM » |
|
It would be preferable to click, and fill out the field, not concerning of where the pointer is standing.
I agree! The field also seems to run into the subtext on the right-most menu item and it is covered by it. Maybe, when the search field is active it should not be transparent and should stay on top to make it easy to read? Paul
|
|
|
Logged
|
|
|
|
jonahh
|
|
« Reply #2 on: September 25, 2008, 04:37:08 PM » |
|
Hello guys, In order to change from mouseover to onclick please follow the below: On line 549 of index.php look for: <div id="s5_search" onmouseover="s5_mouseopen();" onmouseout="s5_mouseclose();"> <div id="s5_searchbox" style="z-index:300;position:absolute;" onmouseover="s5_mouseopen();" onmouseout="s5_mouseclose();"> and replace with: <div id="s5_search" onclick="s5_mouseopen();"> <div id="s5_searchbox" style="z-index:300;position:absolute;" onclick="s5_mouseopen();"> On line 73 of s5_effects.js look for: function s5_mouseopen() { document.getElementById("s5_searchbox").style.display = "block"; } function s5_mouseclose() { document.getElementById("s5_searchbox").style.display = "none"; }
and replace with: var s5clicked_SOG = 0
function s5_mouseopen() {
if (s5clicked_SOG == 0 ){ document.getElementById("s5_searchbox").style.display = "block"; s5clicked_SOG = 1; }
if (s5clicked_SOG == 1 ){ document.getElementById("s5_searchbox").style.display = "none"; s5clicked_SOG = 0; }
} Let me know if this doesn't work As for making the image solid, you can edit the "s5_seg_search.png" image to do this. Regards,
|
|
|
Logged
|
Jonah Hall ------------ Shape 5 Team - Need a great host for your website? We highly recommend siteground.com!
- Put your trust in the hands of our extremely qualified staff to get your job done right! - Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:Install Firebug
|
|
|
akerman
|
|
« Reply #3 on: September 26, 2008, 10:56:35 AM » |
|
Tried the suggested alterations, Not working I'm afraid, but then again, it could be me... (naa... ) Changed 'index.php': </div>
<?php if($this->countModules('top')) { ?>
<div id="s5_search" onclick="s5_mouseopen();">
<div id="s5_searchbox" style="z-index:300;position:absolute;" onclick="s5_mouseopen();">
<?php if ($is_ie6 == "yes") { ?>
<div style="position:relative;width:170px;height:30px;">
<div style="position:absolute;z-index:300;">
.. and the 's5_effects.js'/* changed search box behaviour from mouseover to click. index.php also changed to reflect this 080926 ROA */
var s5clicked_SOG = 0
function s5_mouseopen() {
if (s5clicked_SOG == 0 ){ document.getElementById("s5_searchbox").style.display = "block"; s5clicked_SOG = 1; }
if (s5clicked_SOG == 1 ){ document.getElementById("s5_searchbox").style.display = "none"; s5clicked_SOG = 0; }
}
The effect? Well the magnifying glass is clickable and shapes the mousepointer into the 'hand' in FF, so definitively the 'action' is there. However nothing happens when actually clicked. Actually feel a bit ashamed for not being able to solve this myself... know what I mean? Regards Akerman
|
|
|
Logged
|
|
|
|
akerman
|
|
« Reply #4 on: September 26, 2008, 11:38:18 AM » |
|
...shame can be a good motivator for learning! Solved this. Jonah, if you have a better way to do this then please share, c'ause I'm no programmer...just stubborn. Ok, in 'index.php' (approx. around line 530-550): <?php if($this->countModules('top')) { ?>
<div id="s5_search" onclick="s5_mousestate();">
<div id="s5_searchbox" style="z-index:300;position:absolute;" onclick="s5_mousestate();">
And in s5_effects.js (approx around line 70-80):var s5clicked_SOG = 0
function s5_mousestate() {
if (s5clicked_SOG == 0 ){ document.getElementById("s5_searchbox").style.display = "block"; s5clicked_SOG = 1; }
else if (s5clicked_SOG == 1 ){ document.getElementById("s5_searchbox").style.display = "none"; s5clicked_SOG = 0; } }
1. Clicking magnifying glass opens search field 2. Clicking inside search field gives input marker so you can fill it with your preferred search string: "Where is stuff X?" 3. Clicking the magnifying glass with open search field, closes the same. Took me about 30 minutes to go from shame to fame! (Never hacked 'js' before, that's a first!) Regards Akerman
|
|
« Last Edit: September 26, 2008, 11:43:30 AM by akerman »
|
Logged
|
|
|
|
cypresstw
Jr. Member
Offline
Posts: 9
|
|
« Reply #5 on: September 26, 2008, 11:47:54 AM » |
|
How can I make the search box always display? Without mouseover or popups.
|
|
|
Logged
|
|
|
|
jonahh
|
|
« Reply #6 on: September 27, 2008, 09:57:18 AM » |
|
Nice work akerman! cypresstw, To do this, open up your template_css.css and at line 628 you'll see: #s5_searchbox { background:transparent url(../images/s5_seg_search.png) no-repeat scroll 0 0; display:none; height:31px; margin-left:-170px; position:relative; top:19px; width:207px; z-index:7; } Take off the "display:none;" and then in your index.php file at about line 549 look for: <div id="s5_search" onmouseover="s5_mouseopen();" onmouseout="s5_mouseclose();"> <div id="s5_searchbox" style="z-index:300;position:absolute;" onmouseover="s5_mouseopen();" onmouseout="s5_mouseclose();"> And replace it with: <div id="s5_search" > <div id="s5_searchbox" style="z-index:300;position:absolute;"> Regards,
|
|
|
Logged
|
Jonah Hall ------------ Shape 5 Team - Need a great host for your website? We highly recommend siteground.com!
- Put your trust in the hands of our extremely qualified staff to get your job done right! - Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:Install Firebug
|
|
|
crony
Jr. Member
Offline
Posts: 46
|
|
« Reply #7 on: November 10, 2008, 02:52:54 PM » |
|
Thanks for sharing Ackerman ! This template is really cool...
|
|
|
Logged
|
|
|
|
crony
Jr. Member
Offline
Posts: 46
|
|
« Reply #8 on: December 07, 2008, 07:05:39 PM » |
|
Hello, This hack does not seems to work under...IE7... Is there a way to fix that ? The url of the website: http://geysse.comThe strange thing is you have to let your mouse clicked to be abble to writte a letter or 2...
|
|
|
Logged
|
|
|
|
akerman
|
|
« Reply #9 on: December 08, 2008, 04:18:50 AM » |
|
Hi,
I tried the search function on your page with IE7 and it does not behave the same as mine does with IE7.
Like you said, the text 'recherce' (search) does not go away, but bounces, right back, render it impossible to write the search string. This does not happen on my site.
The PHP in your index.php looks OK, so please re-check the javascript once more.
Regards Akerman
|
|
|
Logged
|
|
|
|
crony
Jr. Member
Offline
Posts: 46
|
|
« Reply #10 on: December 08, 2008, 09:02:49 AM » |
|
Hello,
Thanks for your post. I tried unpublishing all modules and all plugins but search (plug and mod), and get the same result... Checked the js file, it's okay...
I've never ran the sql script with the template, because my website was advanced while I discovered SOG, but I don't think it might the problem...
I don't get it...
|
|
|
Logged
|
|
|
|
akerman
|
|
« Reply #11 on: December 08, 2008, 04:28:39 PM » |
|
Ok,
the next step I would try is to temporarily shut off the Global News module and the other dynamic things on the page.
Why? Simply because one can suspect that IE7 has a problem with the interrupt for some other script and is indirectly effecting the template javascript. Even when managing to put the cursor in the search field it's blinking extremely fast. To me that is an indication of timing problems/priority inconsistency.
Just an idea...
regards,
|
|
|
Logged
|
|
|
|
crony
Jr. Member
Offline
Posts: 46
|
|
« Reply #12 on: December 08, 2008, 06:18:44 PM » |
|
Hi, I really unpublished everything before... (locally ) And why would that not work with other pages without no javascript ? I restored the original files, without hack, and now it works... I'm almost sure that it was working before on IE7... So, I guess I may say I have a ghost on my computer making fun of me... What else ?
|
|
« Last Edit: December 08, 2008, 06:21:54 PM by crony »
|
Logged
|
|
|
|
akerman
|
|
« Reply #13 on: December 09, 2008, 02:44:51 AM » |
|
I too get that feeling sometimes However, in the end there always just been some code lurking around, or cache... still, sometimes things are very strange. Especially when it comes to IE. Expect to bump into more problems with that browser. Oh, by the way, the different heights you have on left/right columns is solved. Answer is here: http://www.shape5.com/component/option,com_smf/Itemid,75/topic,2421.0/regards,
|
|
« Last Edit: December 09, 2008, 02:46:52 AM by akerman »
|
Logged
|
|
|
|
crony
Jr. Member
Offline
Posts: 46
|
|
« Reply #14 on: December 09, 2008, 07:00:38 AM » |
|
I'll try again the hack after all the site is stable... Sorry but what's my problem with my left/right columns ? I read your post but didn't fully understand, my columns are equals, aren't they ?
|
|
|
Logged
|
|
|
|
|