New Posts  All Forums:Forum Nav:

OCN Classic - Page 31

post #301 of 378
Thread Starter 
Quote:
Originally Posted by kenpachiroks View Post

This can be done. I haven't done this because I use it as an indication to know when my cursor has strayed. It subconsciously helps me position my cursor.

If you want the profile button to behave the same way as the drop down, use the following compilation:
Code:
.ui-header-fixed li.profile .user-avatar{
display: block;
opacity:1;
transition:0s 0.55s;

}
.ui-header-fixed li.profile .user-avatar:hover{
opacity:1;
transition:0s;
visibility: visible;
} 
     
.ui-header-fixed li.profile ul.menu{
display: block;
opacity:0;
transition:0s 0.55s;
pointer-events: visiblefill;
visibility: hidden; 
top: 100%;
}
.ui-header-fixed li.profile:hover ul.menu{
opacity:1;
transition:0s;
visibility: visible;
}

Oh wow. This is going to be in the next version of OCN Classic, to be released today sometime now that I have this! Thank you, Ken! I just have to get some sleep first. I'm exhausted.

How did you arrive at 0.55s? That's pretty specific. Did you find the code for the Forums menu?

Edit: How would I make the profile menu button have a delayed reaction like the Forums menu button has?
Edited by TwoCables - 1/31/16 at 4:47am
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
post #302 of 378
Quote:
Originally Posted by TwoCables View Post

Oh wow. This is going to be in the next version of OCN Classic, to be released today sometime now that I have this! Thank you, Ken! I just have to get some sleep first. I'm exhausted.

How did you arrive at 0.55s? That's pretty specific. Did you find the code for the Forums menu?

0.55s is the result of trial and error to see what was comfortable for me.

No, I didn't get any code from the forums menu. I think they've used js to get the lingering effect.
TRON3000
(15 items)
 
 
ASUSness
(5 items)
 
CPUMotherboardGraphicsRAM
Q6600 G0 SLACR @ 3.0 GHz Gigabyte GA-EP31-DS3L MSI 7950 OC BE 3GB 2X2 GB 800 mhz Corsair 
Hard DriveOptical DriveOSOS
Seagate Barracuda 7200rpm 500GB LG super multi Windows 8.1 Pro 64 bit Windows 8 pro 64 bit 
OSMonitorPower
Ubuntu 12.10 Acer 19"W 4ms AL1916W Coolermaster 500W 
CPUGraphicsRAMHard Drive
Intel Core i5-5200U Intel HD Graphics 5500 4GB DDR3L 1600 MHz 128GB SSD 
OSMonitorAudio
Windows 10 64-bit 13.3 in Full HD infinity display Waves MaxxAudio 
CPUGraphicsRAMOS
Intel Core i3 3217U Intel(R) HD Graphics 4000 4.00GB DDR3 Windows 10 64-bit 
Monitor
14" Multitouch 1366x768 
  hide details  
Reply
TRON3000
(15 items)
 
 
ASUSness
(5 items)
 
CPUMotherboardGraphicsRAM
Q6600 G0 SLACR @ 3.0 GHz Gigabyte GA-EP31-DS3L MSI 7950 OC BE 3GB 2X2 GB 800 mhz Corsair 
Hard DriveOptical DriveOSOS
Seagate Barracuda 7200rpm 500GB LG super multi Windows 8.1 Pro 64 bit Windows 8 pro 64 bit 
OSMonitorPower
Ubuntu 12.10 Acer 19"W 4ms AL1916W Coolermaster 500W 
CPUGraphicsRAMHard Drive
Intel Core i5-5200U Intel HD Graphics 5500 4GB DDR3L 1600 MHz 128GB SSD 
OSMonitorAudio
Windows 10 64-bit 13.3 in Full HD infinity display Waves MaxxAudio 
CPUGraphicsRAMOS
Intel Core i3 3217U Intel(R) HD Graphics 4000 4.00GB DDR3 Windows 10 64-bit 
Monitor
14" Multitouch 1366x768 
  hide details  
Reply
post #303 of 378
Thread Starter 
Oh, ok.

How would I make the profile menu button have a delayed reaction like the Forums menu button has?

Edit: I figured it out. smile.gif

Edit 2: I had to take out "top: 100%;" because I'm not going to be making the menu become flush with the navbar.

Edit 3: It's time for me to log out and go to sleep. Thanks again, Ken! All I have to do now is figure out why the profile menu button jumps up and down when the navbar transitions on scrolldown.
Edited by TwoCables - 1/31/16 at 5:10am
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
post #304 of 378
Quote:
Originally Posted by TwoCables View Post

Oh, ok.

How would I make the profile menu button have a delayed reaction like the Forums menu button has?

Edit: I figured it out. smile.gif

Use transition-delay.
What have you used?
Code:
.ui-header-fixed li.profile:hover ul.menu{
opacity:1;
transition-delay: 0.25s;
visibility: visible;
}


A fade in or fade out effect can also be generated. But that is a cosmetic choice.
TRON3000
(15 items)
 
 
ASUSness
(5 items)
 
CPUMotherboardGraphicsRAM
Q6600 G0 SLACR @ 3.0 GHz Gigabyte GA-EP31-DS3L MSI 7950 OC BE 3GB 2X2 GB 800 mhz Corsair 
Hard DriveOptical DriveOSOS
Seagate Barracuda 7200rpm 500GB LG super multi Windows 8.1 Pro 64 bit Windows 8 pro 64 bit 
OSMonitorPower
Ubuntu 12.10 Acer 19"W 4ms AL1916W Coolermaster 500W 
CPUGraphicsRAMHard Drive
Intel Core i5-5200U Intel HD Graphics 5500 4GB DDR3L 1600 MHz 128GB SSD 
OSMonitorAudio
Windows 10 64-bit 13.3 in Full HD infinity display Waves MaxxAudio 
CPUGraphicsRAMOS
Intel Core i3 3217U Intel(R) HD Graphics 4000 4.00GB DDR3 Windows 10 64-bit 
Monitor
14" Multitouch 1366x768 
  hide details  
Reply
TRON3000
(15 items)
 
 
ASUSness
(5 items)
 
CPUMotherboardGraphicsRAM
Q6600 G0 SLACR @ 3.0 GHz Gigabyte GA-EP31-DS3L MSI 7950 OC BE 3GB 2X2 GB 800 mhz Corsair 
Hard DriveOptical DriveOSOS
Seagate Barracuda 7200rpm 500GB LG super multi Windows 8.1 Pro 64 bit Windows 8 pro 64 bit 
OSMonitorPower
Ubuntu 12.10 Acer 19"W 4ms AL1916W Coolermaster 500W 
CPUGraphicsRAMHard Drive
Intel Core i5-5200U Intel HD Graphics 5500 4GB DDR3L 1600 MHz 128GB SSD 
OSMonitorAudio
Windows 10 64-bit 13.3 in Full HD infinity display Waves MaxxAudio 
CPUGraphicsRAMOS
Intel Core i3 3217U Intel(R) HD Graphics 4000 4.00GB DDR3 Windows 10 64-bit 
Monitor
14" Multitouch 1366x768 
  hide details  
Reply
post #305 of 378
Thread Starter 
Quote:
Originally Posted by kenpachiroks View Post

Use transition-delay.
What have you used?
Code:
.ui-header-fixed li.profile:hover ul.menu{
opacity:1;
transition-delay: 0.25s;
visibility: visible;
}


A fade in or fade out effect can also be generated. But that is a cosmetic choice.

I ninja-edited you above. I'm sorry.

I'm using that same code: transition-delay: 0.25s.

I learned how to do a fade in and/or a fadeout a few minutes ago. I might haev a short fade because that's higher quality, like what OCN would do if they were running this site all on their own.
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
post #306 of 378
Thread Starter 
I figured out why the profile menu button is moving up and down when the navbar transitions into the sticky navbar on scrolldown (or when it transitions back into the normal navbar on scrollup):
Code:
.ui-header-fixed li.profile .user-avatar {
        display: block;
        opacity:1;
        transition: 0s .5s;
}

"transition: 0s .5s;" is the culprit. Changing ".5s" to something longer or shorter reveals that this is the culprit. Having "transition: 0s .5s;" gives me precisely what I want, except the avatar annoyingly moves up and down on each navbar transition whether scrolling down or up - and I feel that this is unacceptable because I'm going for the highest quality here. I also feel that removing "transition: 0s .5s;" reduces the quality because then the button's hover effect goes away as soon as I take my mouse off of the menu. I mean, it's inconsistent with the Forums menu button.

So, @kenpachiroks, can you help me figure out how to keep a half-second delay without getting the 'jumping avatar' on each navbar-style change?


Edit: So far, this is what I am using:
Code:
.ui-header-fixed li.profile .user-avatar:hover {
        opacity: 1;
        transition: 0s;
        visibility: visible;
}     
.ui-header-fixed li.profile ul.menu {
        display: block;
        opacity: 0;
        transition: 0s .50s;
        pointer-events: visiblefill;
        visibility: hidden; 
}
.ui-header-fixed li.profile:hover ul.menu {
        opacity: 1;
        transition: 0s;
        visibility: visible;
        transition-delay: .22s;
}

It is consistent with the Forums menu, except the button extends below the navbar before the menu appears. I'm assuming at this point that this cannot be changed, so this code might make it into the official release of 1.4.7. I'm not sure yet though.
Edited by TwoCables - 1/31/16 at 11:39pm
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
post #307 of 378
Quote:
Originally Posted by TwoCables View Post

I figured out why the profile menu button is moving up and down when the navbar transitions into the sticky navbar on scrolldown (or when it transitions back into the normal navbar on scrollup):
"transition: 0s .5s;" is the culprit. Changing ".5s" to something longer or shorter reveals that this is the culprit. Having "transition: 0s .5s;" gives me precisely what I want, except the avatar annoyingly moves up and down on each navbar transition whether scrolling down or up - and I feel that this is unacceptable because I'm going for the highest quality here. I also feel that removing "transition: 0s .5s;" reduces the quality because then the button's hover effect goes away as soon as I take my mouse off of the menu. I mean, it's inconsistent with the Forums menu button.

So, @kenpachiroks, can you help me figure out how to keep a half-second delay without getting the 'jumping avatar' on each navbar-style change?


Edit: So far, this is what I am using:
Code:
.ui-header-fixed li.profile .user-avatar:hover {
        opacity: 1;
        transition: 0s;
        visibility: visible;
}     
.ui-header-fixed li.profile ul.menu {
        display: block;
        opacity: 0;
        transition: 0s .50s;
        pointer-events: visiblefill;
        visibility: hidden; 
}
.ui-header-fixed li.profile:hover ul.menu {
        opacity: 1;
        transition: 0s;
        visibility: visible;
        transition-delay: .22s;
}

It is consistent with the Forums menu, except the button extends below the navbar before the menu appears. I'm assuming at this point that this cannot be changed, so this code might make it into the official release of 1.4.7. I'm not sure yet though.

I can try. I didn't notice the tiny jump at all until you pointed it out.

From the code you've posted above the following is redundant (unless you use the non-hover bit that contains the transition)
Code:
.ui-header-fixed li.profile .user-avatar:hover {
        opacity: 1;
        transition: 0s;
        visibility: visible;
TRON3000
(15 items)
 
 
ASUSness
(5 items)
 
CPUMotherboardGraphicsRAM
Q6600 G0 SLACR @ 3.0 GHz Gigabyte GA-EP31-DS3L MSI 7950 OC BE 3GB 2X2 GB 800 mhz Corsair 
Hard DriveOptical DriveOSOS
Seagate Barracuda 7200rpm 500GB LG super multi Windows 8.1 Pro 64 bit Windows 8 pro 64 bit 
OSMonitorPower
Ubuntu 12.10 Acer 19"W 4ms AL1916W Coolermaster 500W 
CPUGraphicsRAMHard Drive
Intel Core i5-5200U Intel HD Graphics 5500 4GB DDR3L 1600 MHz 128GB SSD 
OSMonitorAudio
Windows 10 64-bit 13.3 in Full HD infinity display Waves MaxxAudio 
CPUGraphicsRAMOS
Intel Core i3 3217U Intel(R) HD Graphics 4000 4.00GB DDR3 Windows 10 64-bit 
Monitor
14" Multitouch 1366x768 
  hide details  
Reply
TRON3000
(15 items)
 
 
ASUSness
(5 items)
 
CPUMotherboardGraphicsRAM
Q6600 G0 SLACR @ 3.0 GHz Gigabyte GA-EP31-DS3L MSI 7950 OC BE 3GB 2X2 GB 800 mhz Corsair 
Hard DriveOptical DriveOSOS
Seagate Barracuda 7200rpm 500GB LG super multi Windows 8.1 Pro 64 bit Windows 8 pro 64 bit 
OSMonitorPower
Ubuntu 12.10 Acer 19"W 4ms AL1916W Coolermaster 500W 
CPUGraphicsRAMHard Drive
Intel Core i5-5200U Intel HD Graphics 5500 4GB DDR3L 1600 MHz 128GB SSD 
OSMonitorAudio
Windows 10 64-bit 13.3 in Full HD infinity display Waves MaxxAudio 
CPUGraphicsRAMOS
Intel Core i3 3217U Intel(R) HD Graphics 4000 4.00GB DDR3 Windows 10 64-bit 
Monitor
14" Multitouch 1366x768 
  hide details  
Reply
post #308 of 378
Thread Starter 
Quote:
Originally Posted by kenpachiroks View Post

I can try. I didn't notice the tiny jump at all until you pointed it out.

From the code you've posted above the following is redundant (unless you use the non-hover bit that contains the transition)
Code:
.ui-header-fixed li.profile .user-avatar:hover {
        opacity: 1;
        transition: 0s;
        visibility: visible;

Oh. Thank you. I don't know what you mean by "unless you use the non-hover bit that contains the transition", but I removed it. Thank you for pointing that out!
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
post #309 of 378
Thread Starter 
Can you help me do the same thing for the Search menu?

Edit: This might not work. Here's what I have so far:
Code:
.ui-header-fixed .search-bar-outer {
        display: block;
        opacity: 0;
        transition: 0s .50s;
        pointer-events: visiblefill;
        visibility: hidden; 
}
.ui-header-fixed ul#main-nav .search:hover .search-bar-outer {
        opacity: 1;
        transition: 0s;
        visibility: visible;
        transition-delay: .22s;
}

As you can see, it almost works - except the location of where the 'advanced search' link causes a hover action (hover over the space where it would be located if the menu were open). Additionally, it breaks my code to put the search bar onto the navbar. Not only that, but my code for hiding the search button (having no search at all) doesn't prevent the search menu from appearing when the mouse hovers on that location where the 'advanced search' link is.

So, this could be difficult.
Edited by TwoCables - 2/3/16 at 4:13am
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
It's a computer!
(19 items)
 
  
CPUMotherboardGraphicsRAM
i5-2500K @ 4.5GHz (1.368-1.384V fixed voltage) ASUS P8P67 EVO B3 (UEFI ver. 1850) GTX 780 ASUS DirectCU II (1228 / 6300, 1.180V) G.SKILL Ripjaws X 8GB (2 x 4GB) 1866MHz, CL9 
Hard DriveHard DriveHard DriveOptical Drive
250 GB Samsung 840 EVO (C:\) 250 GB Samsung 840 EVO (D:\) 150 GB WD VelociRaptor Samsung SH-S243N 24x DVD Burner 
Optical DriveCoolingOSMonitor
Samsung SH-S203N 20X DVD Burner Thermaltake Frio Win 7 Home Premium x64 SP1 Retail AOC G2460PG (24" 1920 x 1080 144Hz G-SYNC) 
KeyboardPowerCaseMouse
Filco Majestouch 104-key Cherry MX Blues w/NKRO Corsair HX650 (Bronze, ordered on 12-12-2009) CM 690 Intellimouse Optical (1.1A) 1000Hz polling rate 
Mouse PadAudioAudio
Basic, but premium round X-Fi Titanium HD Klipsch ProMedia 2.1 (with 16 AWG Monster Cable... 
  hide details  
Reply
post #310 of 378
Quote:
Originally Posted by TwoCables View Post

Can you help me do the same thing for the Search menu?

Edit: This might not work. Here's what I have so far:
Code:
.ui-header-fixed .search-bar-outer {
        display: block;
        opacity: 0;
        transition: 0s .50s;
        pointer-events: visiblefill;
        visibility: hidden; 
}
.ui-header-fixed ul#main-nav .search:hover .search-bar-outer {
        opacity: 1;
        transition: 0s;
        visibility: visible;
        transition-delay: .22s;
}


As you can see, it almost works - except the location of where the 'advanced search' link causes a hover action (hover over the space where it would be located if the menu were open). Additionally, it breaks my code to put the search bar onto the navbar. Not only that, but my code for hiding the search button (having no search at all) doesn't prevent the search menu from appearing when the mouse hovers on that location where the 'advanced search' link is.

So, this could be difficult.

I missed your ninja edit again. yeah, my code is more or less the same as what you've put together (since there is some degeneracy in the element names)

 

.ui-header-fixed .search-bar-outer {
        display: block;
        opacity: 0;
        transition: 0s .50s;
        pointer-events: visiblefill;
        visibility: hidden; 

 

In the first half of the code:

"display:block" applies to the search bar which includes the advanced search link.

The problem is: the "visibility: hidden" command is being ignored by the "advanced search link".

You can check this by changing opacity to 1 (Only the advanced search link will be seen floating)

 

A separate set may have to be written for the advanced search link but the partial adherence to the commands makes it difficult.

TRON3000
(15 items)
 
 
ASUSness
(5 items)
 
CPUMotherboardGraphicsRAM
Q6600 G0 SLACR @ 3.0 GHz Gigabyte GA-EP31-DS3L MSI 7950 OC BE 3GB 2X2 GB 800 mhz Corsair 
Hard DriveOptical DriveOSOS
Seagate Barracuda 7200rpm 500GB LG super multi Windows 8.1 Pro 64 bit Windows 8 pro 64 bit 
OSMonitorPower
Ubuntu 12.10 Acer 19"W 4ms AL1916W Coolermaster 500W 
CPUGraphicsRAMHard Drive
Intel Core i5-5200U Intel HD Graphics 5500 4GB DDR3L 1600 MHz 128GB SSD 
OSMonitorAudio
Windows 10 64-bit 13.3 in Full HD infinity display Waves MaxxAudio 
CPUGraphicsRAMOS
Intel Core i3 3217U Intel(R) HD Graphics 4000 4.00GB DDR3 Windows 10 64-bit 
Monitor
14" Multitouch 1366x768 
  hide details  
Reply
TRON3000
(15 items)
 
 
ASUSness
(5 items)
 
CPUMotherboardGraphicsRAM
Q6600 G0 SLACR @ 3.0 GHz Gigabyte GA-EP31-DS3L MSI 7950 OC BE 3GB 2X2 GB 800 mhz Corsair 
Hard DriveOptical DriveOSOS
Seagate Barracuda 7200rpm 500GB LG super multi Windows 8.1 Pro 64 bit Windows 8 pro 64 bit 
OSMonitorPower
Ubuntu 12.10 Acer 19"W 4ms AL1916W Coolermaster 500W 
CPUGraphicsRAMHard Drive
Intel Core i5-5200U Intel HD Graphics 5500 4GB DDR3L 1600 MHz 128GB SSD 
OSMonitorAudio
Windows 10 64-bit 13.3 in Full HD infinity display Waves MaxxAudio 
CPUGraphicsRAMOS
Intel Core i3 3217U Intel(R) HD Graphics 4000 4.00GB DDR3 Windows 10 64-bit 
Monitor
14" Multitouch 1366x768 
  hide details  
Reply
New Posts  All Forums:Forum Nav:
  Return Home
  Back to Forum: Web Coding