Do you know if it is possible to create a custom sidebar like the one for "show sidebar"?
I know you can create a popup view, but it hovers above the web page - I am looking for a native kind of view like the "sidebar".
Safari does not support any native sidebar at the moment, neither does Chrome (from which Safari copied). Only Firefox and Opera do: https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface/Sidebars
Related
I am using Shopify with PageFly builder and the issue is, that on Safari and iOS, all anchor links won't work. Even on Desktop or mobile.
I used all methods :
https//XXXXX/#link
#link
https://xxxxxx #link
On the first display, only one of the links works. Once the page is loaded and the link on the menu is clicked, none of them works.
Any ideas please ? I'm not a developer and i'm new on this platform.
Issue:
Clicking some anchor elements in a mobile device using Chrome's device emulator fails to navigate to target links.
Here I'm trying to test the behavior of switching the style of product cells from grid view to list view by clicking an icon which is an anchor tag with an href that contains the parameter "disp=list".
Right now clicking the icon does nothing, and the same behavior can be seen in click actions performed on other anchor elements in the navigation bar.
Everything works as expected when I test manually in my chrome emulator and saucelabs but fails when I try with testcafe which shouldn't make a difference since it uses my locally installed browser.
page to test
Command:
testcafe "chrome:emulation:device=iphone X" path-to-file.js
Browser/OS:
Chrome 75.0.3770 / Mac OS X 10.14.5
Here's the test:
fixture`[mobile] navigation`
.page('https://tw.bid.yahoo.com/search/auction/product?qt=product&kw=iphone&p=iphone')
test
('Clicking the view button should switch item cell view', async t => {
await t
.click(Selector('.ViewSwitchButton__viewButton___1r1Kh.MobileNavigation__menuButton___1OVvQ'))
.expect(getPageUrl()).contains('disp=list')
})
clicking the view style icon should update the page from grid view to list view with the url updated to https://tw.bid.yahoo.com/search/auction/product?disp=list&kw=iphone&p=iphone&refine=-prop_3%2C-prop_2
I've reproduced this behavior under "testcafe-hammerhead" proxy. Here is an issue you can track: https://github.com/DevExpress/testcafe-hammerhead/issues/2080.
The fix was included in TestCafe v1.6.0.
I recently found that one of the custom apps I can add to my Rally homepage is a custom HTML app.
This will be really useful to me, since I can use some HTML (Bootstrap) headers to separate apps on my page and make it more organized.
I got the custom HTML to show properly (and I currently have a header/divider) however, it is showing the grey title bar just like any other app would.
Is it possible to hide this when using the HTML app, so just the HTML output shows?
(If anyone is familiar with apps in Sharepoint, it's called a "Chrome" and you can hide the chrome/title so just the content shows.
I don't think there's any built-in chrome to the apps themselves... Can you show a screenshot? Are you following the general formula to embedding apps presented in this guide?
https://help.rallydev.com/apps/2.1/doc/#!/guide/embedding_apps
I think the easiest way to show this is with a picture:
http://oi61.tinypic.com/r2s4f9.jpg
In Web Inspector, I'm trying to change display:block but it's 'locked'. Further, I can't figure out where this is coming from in my source code
It shows as locked because you are not able to edit it directly using DevTools. You have to override the styles in the user agent stylesheet.
Open the Safari Web Inspector and check the Logs, and beware of any browser extensions or content blockers (iOS) you are using which can modify or inject content into a webpage.
The culprit in my case turned out to be a Content Blocker (iOS ad-blocker) which was blocking elements on the page by forcing a User Stylesheet to display:none on certain CSS elements. Because of this, Safari showed it as "locked" like in your screenshot with no way to edit/modify it. A warning appeared in the Web Inspector 'Logs' tab telling me that the content blocker prevented a frame from loading a resource.
Disabling the content blocker removed the forced stylesheet, and fixed the problem in my case.
I'm using jQuery mobile, and am using a home button in the header. When clicked, the home button has a blue highlight. I want to get rid of this, but can't seem to track down the CSS rule/-webkit CSS rule to do this.
Screenshot:
Can anyone help?
In jQuery Mobile the class added to buttons just pressed is: ui-btn-active. Here is a link to the documentation that talks about this class (although it doesn't say much): http://jquerymobile.com/demos/1.0b2/docs/toolbars/docs-navbar.html
Not sure if this is what you needed but I figured it might help. I'd recommend using FireBug or some such DOM Inspection tool to view the button in real-time.
You sure that's not just the default hi-light that links get when focused?
Try
#buttonID:focus{
border: none;
outline: 0;
}
An idea to help you track the problem as you don't share the link (you can easily just share the first page), is to use Safari, Chrome or even Firefox and make them act as an iPhone so you can use their Inspector / Firebug to track the problem
Firefox has a Agent User Switcher that you can easily make use in order to the browser be intrepertate as an iPhone
Chrome has it as well just add the User Agent string in the Extension options to create a new option
Safari 5 is the easiest one as this is already built in:
Open Safari and go to the Preferences, move to Advanced. At the bottom of the tab there is a check box for Show Develop menu in menu bar.
Go to the Develop menu and move to User Agent and select any iOS device.