Go Premium for a chance to win a PS4. Enter to Win

x

Responsive Web

Mobile web development, also known as responsive web design, is an approach to web design aimed at crafting sites to provide an optimal viewing and interaction experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones). A site designed with RWD adapts the layout to the viewing environment by using fluid, proportion-based grids, flexible images, and CSS3 media queries.

Share tech news, updates, or what's on your mind.

Sign up to Post

I have a responsive handburger menu on this site: http://taliance.com
Its a wordpress site running Genesis Theme Framework with a child theme.

You need to scroll down 150px to see the menu, and set your dev console to look at it as a mobile.

It nearly works how we want it, but it doesn't slide back to the left when an item is clicked.
Normally this needn't be a problem. It was designed for linking to other pages. But this menu's links go to ids on the same page, using the PageScroll2id plugin. So, as you'll see, it remains in place.

Can you tell from the dev console what I need to do, either with js/jquery or with css to make it slide away when an item is clicked?

Thank you
0
Free Tool: ZipGrep
LVL 11
Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Navigation extends full width of nav bar in  Chrome  but not in Firefox.  How do I modify navigation so it extends full length for all browsers?  I have modified the css but when I make it work in one browser it fails in the other.

Chrome screenshot
https://screencast.com/t/ClkmvqYqmH

Firefox screenshot
https://screencast.com/t/Q6n7svVyp

Beta site
http://pl.triolibraries.com/

.main-navigation-menu a {
    display: block;
  padding: 14px 1.9em;}
  
#navi-wrap {
    border-top: 0px solid #004488;
    border-bottom: 0px solid #004488;
}
  
.main-navigation-menu li:last-child { border: none; }

Open in new window

0
I had this question after viewing How to redirect after a user shares something one facebook.
Hi, I am a man in the street who knows nothing about coding……Please help, My aim is that when FB visitors click on this link on my post: https://www.facebook.com/sharer/sharer.php?u=https://goo.gl/nsbpk5
It will obviously take them to share dialogue, and when they click share, I need them to be redirected (URL Redirection or dialog/feed) to this one: https://goo.gl/HSo5rf    this one has to pop up. So how do I join these hyperlinks to make one?
I tried this: https://www.facebook.com/sharer/sharer.php?u=https://goo.gl/nsbpk5&redirect_uri=https://goo.gl/HSo5rf
 but it gives me a this blank page after clicking SHARE: https://www.facebook.com/dialog/return/close#_=_
In short this should  be a full page display, shown within Facebook.com.
and a popup page should be compatible to Mobile web apps as well.
Where did I go wrong???????
0
see theme for vb3
and when i zoom  the page some objects are hide to looks good in responsive
see pic
before zoom
Untitled.jpgafter zoom
ssss.jpg
0
I've created a template in WordPress and I want the page it generates to scale as the viewport size changes. I've done this outside of WordPress by first expressing all my units in rems and then  setting the html font-size proportional to the viewport size by placing the code below in the DOM Ready section:

var viewport_width = $( window ).width();  // Returns width of the current browser viewport
		if (viewport_width < 1400) {	        
			font_pc = (viewport_width / 1400) * .625 * 100);   
			$(html).css("font-size", font_pc + '%');
		}

Open in new window


Actually this starts the scaling when the viewport is < 1400px and  In this example, if the viewport were 1200px font_pc would e 53.6% and that would become the html element font-size, reducing everything expressed in rems.

My question is, how can I pull this off for a WordPress template php file?

Thanks
0
We have a computer that is connected to a Cisco ASA router. This local router sets up an encrypted tunnel to a Cisco ASA router at a remote location. This remote location has a couple of web servers. From the workstation, I am able to ping (by DNS name and IP address) both web servers, see the ports 80 and 443 open and can always resolve one of the web pages (we'll call it works.company.org). The other webpage we'll call broke.company.org we cannot resolve.

After researching this with wireshark, I can see that the workstation sends a "Client Hello" to broke.company.org, but doesn't see any "Server Hello" response back. However, from the web server side, a packet capture reveals that it does attempt to send its' "Server Hello, Certificate, Server Key Exchange, Server Hello Done" to the workstation, but it doesn't make it to the workstation.

If we change the workstation's IP address to another IP address in the local subnet, it is able to communicate with the web server for about a day and then something locks up that IP address permanently and then SSL handshake will no longer complete until I change the workstation IP address to a new/different IP address in the local subnet.

If we connect this workstation and Cisco ASA Router to a different commercial ISP line, the web page at broke.company.org resolves every time.

We've tried changing the MTU size on the workstation and on the local Cisco ASA router and that doesn't resolve the problem.

The firewalls in …
0
Hi Experts,

One of our websites was compromised and after been restored, noticed the website is in mobile view by default and not showing correctly on desktop, entire layout is not right, in the footer of the page they are not align in 4 columns horizontally, but aligned vertically.  And the logo is not to the left and the banner to the right. Not sure whats happened with the css and some help on this would be much appreciated to restore our site n business online.  url: pgzambia.com
0
Dns look up
0
I have a web site that is responsive and works well on various mobile devices.  The web pages are currently not online, as my client is by their choice,  manually downloading it to tablets to use.

How do I make it an app that can be opened and downloaded -- ideally without having to be online once downloaded.

Thanks.
0
Hi

I am try to implement the SSO and LTPA for Mobile First Platform, but I don't know how to achieve this.

we are using the Websphere Liberty 8.5.3 and it's running on Linux red-hat.

Could somebody give me some good materials or link for this.
0

Responsive Web

Mobile web development, also known as responsive web design, is an approach to web design aimed at crafting sites to provide an optimal viewing and interaction experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones). A site designed with RWD adapts the layout to the viewing environment by using fluid, proportion-based grids, flexible images, and CSS3 media queries.